.generator-stage{position:relative;overflow:hidden;padding:clamp(24px,3vw,40px);border:1px solid color-mix(in srgb,var(--mode-accent),transparent 56%);border-radius:24px;background:linear-gradient(145deg,color-mix(in srgb,var(--mode-accent),var(--card) 94%),var(--card) 48%,color-mix(in srgb,var(--navy),var(--card) 96%));box-shadow:0 22px 58px #06142516,inset 0 1px #ffffffb8}
.generator-stage:before{content:"";position:absolute;inset:-45% -15% auto 48%;height:320px;background:radial-gradient(circle,color-mix(in srgb,var(--mode-accent),transparent 72%),transparent 68%);pointer-events:none}
.generator-stage-head{position:relative;display:flex;justify-content:space-between;gap:28px;align-items:flex-start;margin-bottom:26px}.generator-stage-head>div{max-width:820px}.generator-stage-badge{display:inline-flex;align-items:center;min-height:28px;padding:0 11px;border:1px solid color-mix(in srgb,var(--mode-accent),transparent 56%);border-radius:999px;background:color-mix(in srgb,var(--mode-accent),transparent 90%);color:var(--mode-accent);font-size:12px;font-weight:900;letter-spacing:.055em;text-transform:uppercase}.generator-stage h2{margin:12px 0 8px;color:var(--ink);font-size:clamp(26px,3vw,40px);line-height:1.12;letter-spacing:-.035em}.generator-stage-head p{max-width:760px;margin:0;color:var(--muted);font-size:16px;line-height:1.65}.generator-stage-local{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;min-height:38px;padding:0 13px;border:1px solid color-mix(in srgb,var(--green),transparent 65%);border-radius:999px;background:color-mix(in srgb,var(--green),transparent 92%);color:var(--green);font-size:13px;font-weight:800}
.generator-stage-workspace{position:relative;display:grid;grid-template-columns:minmax(280px,.78fr) minmax(420px,1.22fr);gap:18px}.generator-stage-choices{display:grid;align-content:start;gap:10px}.generator-stage-label{margin:0 0 2px;color:var(--muted);font-size:12px;font-weight:900;letter-spacing:.07em;text-transform:uppercase}.generator-stage-choice{display:grid;grid-template-columns:42px 1fr 18px;gap:13px;align-items:center;width:100%;min-height:82px;padding:14px;border:1px solid var(--line);border-radius:15px;background:color-mix(in srgb,var(--card),var(--bg) 28%);color:var(--ink);text-align:left;font:inherit;cursor:pointer;transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease}.generator-stage-choice:hover,.generator-stage-choice:focus-visible{transform:translateX(4px);border-color:color-mix(in srgb,var(--mode-accent),transparent 40%)}.generator-stage-choice.active{border-color:color-mix(in srgb,var(--mode-accent),transparent 28%);background:color-mix(in srgb,var(--mode-accent),var(--card) 91%);box-shadow:0 12px 30px color-mix(in srgb,var(--mode-accent),transparent 88%)}.generator-stage-choice-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:color-mix(in srgb,var(--mode-accent),transparent 84%);color:var(--mode-accent);font-size:19px;font-weight:900}.generator-stage-choice>span:nth-child(2){display:grid;gap:4px}.generator-stage-choice b{font-size:15px}.generator-stage-choice small{color:var(--muted);font-size:12px;line-height:1.42}.generator-stage-choice>i{color:var(--mode-accent);font-style:normal;font-weight:900;opacity:.45}.generator-stage-choice.active>i{opacity:1}
.generator-stage-preview{overflow:hidden;min-height:312px;border:1px solid #28415f;border-radius:18px;background:#08111d;box-shadow:0 18px 46px #07132130,inset 0 1px #ffffff0d;color:#dcecff}.generator-stage-preview>header{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;min-height:50px;padding:0 17px;border-bottom:1px solid #26394f;background:#111e2c}.generator-stage-preview>header>span{display:flex;gap:6px}.generator-stage-preview>header i{display:block;width:8px;height:8px;border-radius:50%;background:#53677b}.generator-stage-preview>header i:first-child{background:#ef6a62}.generator-stage-preview>header i:nth-child(2){background:#eebc4d}.generator-stage-preview>header i:last-child{background:#47c77d}.generator-stage-preview>header b{font-size:13px}.generator-stage-preview>header em{color:#63dba7;font-size:11px;font-style:normal;font-weight:800}.generator-stage-preview-body{padding:24px 26px;animation:generator-stage-in .28s ease both}.generator-stage-preview-body.is-refreshing{animation:generator-stage-refresh .28s ease both}.generator-stage-kind{display:inline-flex;padding:5px 8px;border:1px solid #2a5f76;border-radius:6px;background:#0d2a39;color:#63dff5;font:800 11px/1.2 Consolas,monospace;letter-spacing:.06em}.generator-stage-preview h3{margin:14px 0 12px;color:#fff;font-size:20px}.generator-stage-preview pre{min-height:98px;margin:0;padding:16px;border:1px solid #1e3248;border-radius:11px;background:#050a10;color:#d8ecff;font:14px/1.65 Consolas,monospace;white-space:pre-wrap;overflow:auto}.generator-stage-preview pre:before{content:"PS> ";color:#58d6ee}.generator-stage-preview p{margin:13px 0 0;color:#91a9bf;font-size:12px;line-height:1.5}
.generator-stage-footer{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin-top:24px}.generator-stage-flow{min-width:0}.generator-stage-flow>b{display:block;margin-bottom:10px;color:var(--muted);font-size:12px;letter-spacing:.07em;text-transform:uppercase}.generator-stage-flow ol{display:flex;align-items:center;gap:9px;margin:0;padding:0;list-style:none}.generator-stage-flow li{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px}.generator-stage-flow li[aria-hidden]{color:var(--mode-accent);font-weight:900}.generator-stage-flow li span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:color-mix(in srgb,var(--mode-accent),transparent 84%);color:var(--mode-accent);font-weight:900}.generator-stage-flow em{font-style:normal;font-weight:800}.generator-stage-open{display:inline-flex;align-items:center;justify-content:center;gap:13px;flex:0 0 auto;min-height:48px;padding:0 19px;border:1px solid var(--mode-accent);border-radius:12px;background:var(--mode-accent);color:#071421;font:inherit;font-size:14px;font-weight:800;line-height:1.2;cursor:pointer;box-shadow:0 13px 28px color-mix(in srgb,var(--mode-accent),transparent 72%);transition:transform .2s ease,box-shadow .2s ease}.generator-stage-open:hover,.generator-stage-open:focus-visible{transform:translateY(-2px);box-shadow:0 17px 35px color-mix(in srgb,var(--mode-accent),transparent 58%)}.generator-stage-safety{display:flex;gap:9px;align-items:center;margin:20px 0 0;padding-top:17px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}.generator-stage-safety b{color:var(--ink)}
.generator-tool-featured{position:relative;border-color:color-mix(in srgb,var(--mode-accent),transparent 40%);background:linear-gradient(145deg,color-mix(in srgb,var(--mode-accent),var(--card) 91%),var(--card))}.generator-tool-featured:after{content:"★";position:absolute;right:14px;top:12px;color:var(--mode-accent);font-size:13px}.generator-execution-note{display:flex;gap:14px;align-items:flex-start;max-width:1000px;margin:-12px 0 24px;padding:16px 18px;border:1px solid color-mix(in srgb,var(--green),transparent 68%);border-radius:13px;background:color-mix(in srgb,var(--green),var(--card) 95%)}.generator-execution-note>span{display:grid;place-items:center;flex:0 0 auto;width:34px;height:34px;border-radius:10px;background:color-mix(in srgb,var(--green),transparent 85%)}.generator-execution-note b{color:var(--ink)}.generator-execution-note p{margin:4px 0 0;color:var(--muted);font-size:13px;line-height:1.5}
.dark-theme .generator-stage{background:linear-gradient(145deg,color-mix(in srgb,var(--mode-accent),#101c2b 94%),#101c2b 52%,#0b1521);border-color:color-mix(in srgb,var(--mode-accent),transparent 62%);box-shadow:0 24px 62px #00000042,inset 0 1px #ffffff0c}.dark-theme .generator-stage-choice{background:#0c1725;border-color:#293a4d}.dark-theme .generator-stage-choice.active{background:color-mix(in srgb,var(--mode-accent),#0e1a29 88%)}.dark-theme .generator-execution-note{background:color-mix(in srgb,var(--green),#101c2b 92%)}
@keyframes generator-stage-in{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}@keyframes generator-stage-refresh{0%{opacity:.2;transform:translateX(18px)}100%{opacity:1;transform:none}}
@media(max-width:980px){.generator-stage-workspace{grid-template-columns:1fr}.generator-stage-preview{min-height:0}.generator-stage-footer{align-items:stretch;flex-direction:column}.generator-stage-open{align-self:flex-start}.generator-stage-flow ol{flex-wrap:wrap}}
@media(max-width:680px){.generator-stage{padding:22px 18px;border-radius:18px}.generator-stage-head{display:grid}.generator-stage-local{justify-self:start}.generator-stage-choice{min-height:76px}.generator-stage-preview>header{grid-template-columns:auto 1fr}.generator-stage-preview>header em{grid-column:1/-1;padding-bottom:10px}.generator-stage-preview-body{padding:20px 16px}.generator-stage-flow ol{display:grid;grid-template-columns:1fr}.generator-stage-flow li[aria-hidden]{display:none}.generator-stage-open{width:100%}.generator-stage-safety{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.generator-stage-choice,.generator-stage-open,.generator-stage-preview-body,.generator-stage-preview-body.is-refreshing{transition:none;animation:none}.generator-stage-choice:hover,.generator-stage-open:hover{transform:none}}