*{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#0e0f17;margin:0}#root{min-height:100svh}.app-shell{color:#c8c6d8;background:#0e0f17;min-height:100svh;padding:0 0 80px;font-family:system-ui,Segoe UI,sans-serif}.app-header{text-align:center;border-bottom:1px solid #1e1f2e;padding:56px 24px 36px}.header-badge{letter-spacing:.12em;text-transform:uppercase;color:#5dcaa5;background:#5dcaa51a;border:1px solid #5dcaa540;border-radius:100px;margin-bottom:20px;padding:4px 14px;font-size:11px;font-weight:600;display:inline-block}.app-title{letter-spacing:-1px;color:#eeedf6;margin:0 0 12px;font-size:clamp(26px,4vw,42px);font-weight:700}.app-subtitle{color:#6b6882;max-width:540px;margin:0 auto;font-size:15px;line-height:1.6}.tab-nav{border-bottom:1px solid #1e1f2e;justify-content:center;gap:4px;padding:20px 24px 0;display:flex}.tab-btn{cursor:pointer;color:#5b596e;white-space:nowrap;background:0 0;border:none;border-radius:8px 8px 0 0;padding:10px 18px 12px;font-size:13px;font-weight:500;transition:color .18s;position:relative}.tab-btn:hover{color:#afa9ec}.tab-btn.active{color:#eeedf6}.tab-underline{background:#afa9ec;border-radius:2px 2px 0 0;height:2px;display:block;position:absolute;bottom:-1px;left:0;right:0}.tab-content{max-width:1060px;margin:0 auto;padding:32px 20px 0}.arch-wrapper{align-items:flex-start;gap:28px;display:flex}.arch-canvas-outer{background:#12131f;border:1px solid #1e1f2e;border-radius:16px;flex:1;min-width:0;padding:24px}.arch-svg{cursor:default;width:100%;height:auto;display:block}.arch-hint{text-align:center;color:#3a3950;letter-spacing:.04em;margin-top:12px;font-size:12px}.node-detail{background:#12131f;border:1px solid #1e1f2e;border-radius:16px;flex-direction:column;flex-shrink:0;gap:10px;width:280px;padding:24px 20px;display:flex}.node-detail-phase{letter-spacing:.12em;text-transform:uppercase;font-size:10px;font-weight:700}.node-detail-title{margin:0;font-size:18px;font-weight:700;line-height:1.3}.node-detail-sub{opacity:.85;margin:0;font-size:12px}.node-detail-body{color:#8a88a0;margin:4px 0 0;font-size:13px;line-height:1.65}.node-detail-close{color:#5b596e;cursor:pointer;background:0 0;border:1px solid #2a2b3a;border-radius:8px;align-self:flex-start;margin-top:8px;padding:7px 14px;font-size:12px;transition:border-color .18s,color .18s}.node-detail-close:hover{color:#afa9ec;border-color:#afa9ec}.tab-phases{flex-direction:column;gap:20px;display:flex}.phase-block{background:#12131f;border:1px solid #1e1f2e;border-left:3px solid;border-radius:12px;padding:24px 24px 20px}.phase-label{letter-spacing:.12em;text-transform:uppercase;margin-bottom:6px;font-size:10px;font-weight:700}.phase-title{color:#eeedf6;margin:0 0 18px;font-size:17px;font-weight:700}.phase-steps{flex-direction:column;gap:14px;display:flex}.phase-step{align-items:flex-start;gap:14px;display:flex}.step-icon{flex-shrink:0;margin-top:1px;font-size:18px}.step-label{color:#d4d2e0;margin-bottom:3px;font-size:13px;font-weight:600}.step-desc{color:#6b6882;font-size:12px;line-height:1.6}.stack-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;display:grid}.stack-card{background:#12131f;border:1px solid #1e1f2e;border-top:3px solid;border-radius:12px;flex-direction:column;gap:6px;padding:20px;display:flex}.stack-icon{margin-bottom:2px}.stack-tag{letter-spacing:.1em;text-transform:uppercase;font-size:10px;font-weight:700}.stack-name{color:#eeedf6;font-size:16px;font-weight:700}.stack-desc{color:#6b6882;margin:4px 0 0;font-size:12px;line-height:1.65}.flow-wrapper{grid-template-columns:1fr 1fr;align-items:start;gap:28px;display:grid}.flow-steps{flex-direction:column;gap:0;display:flex}.flow-step{background:#12131f;border:1px solid #1e1f2e;border-bottom:none;align-items:flex-start;gap:14px;padding:16px 20px;display:flex;position:relative}.flow-step:first-child{border-radius:12px 12px 0 0}.flow-step:last-child{border-bottom:1px solid #1e1f2e;border-radius:0 0 12px 12px}.flow-num{color:#afa9ec;background:#1e1f2e;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:11px;font-weight:700;display:flex}.flow-icon{color:#afa9ec;flex-shrink:0;margin-top:2px}.flow-label{color:#d4d2e0;margin-bottom:3px;font-size:13px;font-weight:600}.flow-desc{color:#6b6882;font-size:12px;line-height:1.6}.flow-commands{background:#12131f;border:1px solid #1e1f2e;border-radius:12px;flex-direction:column;gap:14px;padding:20px;display:flex}.commands-title{letter-spacing:.08em;text-transform:uppercase;color:#5dcaa5;align-items:center;gap:8px;margin-bottom:4px;font-size:12px;font-weight:700;display:flex}.command-block{flex-direction:column;gap:4px;display:flex}.command-label{color:#5b596e;font-size:11px;font-weight:500}.command-pre{color:#9fe1cb;white-space:pre-wrap;word-break:break-all;background:#0c0d15;border:1px solid #1e1f2e;border-radius:8px;margin:0;padding:10px 14px;font-family:ui-monospace,Consolas,monospace;font-size:11px;line-height:1.6}@media (width<=720px){.arch-wrapper{flex-direction:column}.node-detail{width:100%}.flow-wrapper{grid-template-columns:1fr}.tab-nav{justify-content:flex-start;padding-bottom:0;overflow-x:auto}}.ss-shell{flex-direction:column;gap:24px;display:flex}.ss-tabs{flex-wrap:wrap;gap:6px;display:flex}.ss-tab{cursor:pointer;color:#5b596e;background:0 0;border:1px solid #1e1f2e;border-radius:10px;align-items:center;gap:8px;padding:8px 16px;font-size:13px;font-weight:500;transition:color .18s,border-color .18s;display:flex;position:relative;overflow:hidden}.ss-tab:hover{color:#c8c6d8;border-color:#2e2f42}.ss-tab--active{color:#eeedf6;border-color:#0000}.ss-tab-pill{z-index:0;border:1px solid;border-radius:10px;position:absolute;inset:0}.ss-tab-label{z-index:1;position:relative}.ss-tab-count{z-index:1;color:#3a3950;text-align:center;background:#1a1b28;border-radius:100px;min-width:20px;padding:1px 7px;font-size:11px;font-weight:700;transition:color .18s;position:relative}.ss-intro{color:#8a88a0;background:#12131f;border:1px solid #1e1f2e;border-left:3px solid;border-radius:10px;align-items:flex-start;gap:12px;padding:14px 18px;font-size:13px;line-height:1.65;display:flex}.ss-intro-dot{border-radius:50%;flex-shrink:0;width:7px;height:7px;margin-top:5px}.ss-grid{gap:20px;display:grid}.ss-grid--single{grid-template-columns:1fr;max-width:780px}.ss-grid--two{grid-template-columns:repeat(2,1fr)}.ss-grid--three{grid-template-columns:repeat(3,1fr)}@media (width<=860px){.ss-grid--two,.ss-grid--three{grid-template-columns:1fr}}.ss-card{background:#12131f;border:1px solid #1e1f2e;border-radius:14px;flex-direction:column;transition:border-color .18s;display:flex;overflow:hidden}.ss-card:hover{border-color:#2e2f42}.ss-img-wrap{cursor:zoom-in;aspect-ratio:16/9;background:#0c0d15;border-bottom:1px solid #1e1f2e;position:relative;overflow:hidden}.ss-img{object-fit:cover;object-position:top left;width:100%;height:100%;transition:transform .35s,filter .25s;display:block}.ss-img-wrap:hover .ss-img{filter:brightness(.7);transform:scale(1.03)}.ss-img-overlay{color:#eeedf6;letter-spacing:.06em;opacity:0;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:6px;font-size:12px;font-weight:600;transition:opacity .22s;display:flex;position:absolute;inset:0}.ss-img-wrap:hover .ss-img-overlay{opacity:1}.ss-card-body{flex-direction:column;flex:1;gap:8px;padding:16px 18px 18px;display:flex}.ss-card-title{color:#d4d2e0;font-size:14px;font-weight:700}.ss-highlight{letter-spacing:.03em;border:1px solid;border-radius:6px;align-self:flex-start;padding:3px 10px;font-family:ui-monospace,Consolas,monospace;font-size:11px;font-weight:600;display:inline-flex}.ss-caption{color:#6b6882;margin:0;font-size:12px;line-height:1.7}.ss-lightbox-backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:100;background:#08080ee0;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.ss-lightbox-panel{background:#12131f;border:1px solid #2e2f42;border-radius:16px;flex-direction:column;max-width:min(1100px,94vw);max-height:90vh;display:flex;position:relative;overflow:hidden;box-shadow:0 32px 80px #0009}.ss-lightbox-img{object-fit:contain;object-position:top;background:#0c0d15;width:100%;max-height:65vh;display:block}.ss-lightbox-footer{border-top:1px solid #1e1f2e;flex-direction:column;gap:6px;padding:18px 22px 20px;display:flex}.ss-lightbox-title{color:#eeedf6;font-size:15px;font-weight:700}.ss-lightbox-caption{color:#6b6882;margin:0;font-size:12px;line-height:1.7}.ss-lightbox-close{color:#8a88a0;cursor:pointer;z-index:2;background:#1e1f2e;border:1px solid #2e2f42;border-radius:8px;justify-content:center;align-items:center;width:34px;height:34px;transition:background .15s,color .15s;display:flex;position:absolute;top:12px;right:12px}.ss-lightbox-close:hover{color:#eeedf6;background:#2e2f42}.term-steps-list{flex-direction:column;gap:32px;display:flex}.term-step{flex-direction:column;gap:12px;display:flex}.term-step-header{align-items:center;gap:14px;display:flex}.term-step-num{letter-spacing:.06em;border:1px solid;border-radius:8px;flex-shrink:0;padding:4px 10px;font-family:ui-monospace,Consolas,monospace;font-size:11px;font-weight:800}.term-step-title{color:#eeedf6;letter-spacing:-.2px;font-size:16px;font-weight:700}.term-narrative{color:#6b6882;max-width:780px;margin:0;padding-left:2px;font-size:13px;line-height:1.75}.term-window{background:#09090f;border:1px solid #1e1f2e;border-radius:12px;font-family:ui-monospace,Cascadia Code,Consolas,monospace;overflow:hidden}.term-titlebar{background:#131420;border-bottom:1px solid #1e1f2e;align-items:center;gap:8px;padding:10px 16px;display:flex}.term-dot{border-radius:50%;flex-shrink:0;width:11px;height:11px}.term-dot--red{background:#ff5f57}.term-dot--yellow{background:#febc2e}.term-dot--green{background:#28c840}.term-hostname{color:#3e3f56;letter-spacing:.02em;flex:1;margin-left:4px;font-size:12px}.term-copy{color:#5b596e;cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #2a2b3a;border-radius:6px;align-items:center;gap:5px;padding:3px 10px;font-family:inherit;font-size:11px;transition:border-color .15s,color .15s,background .15s;display:flex}.term-copy:hover{color:#5dcaa5;background:#5dcaa50f;border-color:#5dcaa5}.term-body{flex-direction:column;gap:1px;padding:20px 22px 22px;display:flex}.term-blank{height:12px}.term-line{align-items:baseline;gap:10px;line-height:1.8;display:flex}.term-line--comment{padding-left:2px}.term-comment-text{color:#3b5e4a;letter-spacing:.01em;font-size:13px;font-style:italic}.term-prompt{color:#5dcaa5;-webkit-user-select:none;user-select:none;flex-shrink:0;font-size:14px;font-weight:700;line-height:1.8}.term-cmd-text{color:#d4d2e0;letter-spacing:.015em;word-break:break-all;font-size:13.5px}.term-line--cmd:hover .term-cmd-text{color:#eeedf6}.term-line--cmd:hover .term-prompt{color:#9fe1cb}@media (width<=600px){.term-body{padding:16px}.term-cmd-text{font-size:12px}.term-hostname{display:none}}