.arch-node-wrapper{position:relative;width:160px;height:80px;border-radius:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--node-color-1) 15%,var(--surface-card, #1e293b)),color-mix(in srgb,var(--node-color-2) 8%,var(--surface-card, #1e293b)));border:1.5px solid color-mix(in srgb,var(--node-color-1) 40%,transparent);cursor:grab;transition:border-color .3s,box-shadow .3s}.arch-node-wrapper:hover{border-color:var(--node-color-1);box-shadow:0 0 20px color-mix(in srgb,var(--node-color-1) 25%,transparent)}.arch-node-body{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:4px;padding:8px}.arch-node-icon-wrap{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:linear-gradient(135deg,var(--node-color-1),var(--node-color-2));flex-shrink:0}.arch-node-icon{width:16px;height:16px;color:#fff}.arch-node-label{font-size:11px;font-weight:600;color:var(--slate-200, #e2e8f0);text-align:center;line-height:1.3;letter-spacing:.01em}.arch-node-handle{width:8px!important;height:8px!important;background:var(--node-color-1, #6366f1)!important;border:2px solid var(--surface-card, #1e293b)!important;border-radius:50%!important;opacity:0;transition:opacity .2s}.arch-node-wrapper:hover .arch-node-handle{opacity:1}.arch-node-ring{position:absolute;inset:0;border-radius:14px;border:2px solid var(--node-color-1);pointer-events:none}.arch-node-active-ring{position:absolute;inset:-4px;border-radius:18px;background:color-mix(in srgb,var(--node-color-1) 20%,transparent);border:2px solid var(--node-color-1);pointer-events:none}.staged-diagram-container{width:100%;border-radius:20px;background:var(--surface-diagram, #0a0f1e);border:1px solid color-mix(in srgb,var(--indigo-500, #6366f1) 15%,transparent);overflow:hidden;display:flex;flex-direction:column}.staged-diagram-controls{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid color-mix(in srgb,var(--indigo-500, #6366f1) 10%,transparent);background:color-mix(in srgb,var(--indigo-500, #6366f1) 3%,transparent);flex-wrap:wrap;gap:12px}.staged-diagram-title{font-size:14px;font-weight:700;color:var(--slate-200, #e2e8f0);letter-spacing:-.01em}.staged-diagram-pills{display:flex;gap:6px;align-items:center}.staged-diagram-pill{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;border:1.5px solid color-mix(in srgb,var(--slate-500, #64748b) 30%,transparent);background:transparent;color:var(--slate-400, #94a3b8);font-size:13px;font-weight:700;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.staged-diagram-pill:hover{border-color:var(--indigo-500, #6366f1);color:var(--indigo-400, #a78bfa);background:color-mix(in srgb,var(--indigo-500, #6366f1) 8%,transparent)}.staged-diagram-pill.active{border-color:var(--indigo-500, #6366f1);background:linear-gradient(135deg,var(--indigo-600, #8b5cf6),var(--indigo-500, #6366f1));color:#fff;box-shadow:0 0 16px color-mix(in srgb,var(--indigo-500, #6366f1) 30%,transparent)}.staged-diagram-trace-btn{display:flex;align-items:center;gap:6px;padding:8px 16px;border-radius:10px;border:1.5px solid color-mix(in srgb,var(--emerald-500, #10b981) 40%,transparent);background:color-mix(in srgb,var(--emerald-500, #10b981) 8%,transparent);color:var(--emerald-500, #10b981);font-size:12px;font-weight:600;cursor:pointer;transition:all .25s;letter-spacing:.02em}.staged-diagram-trace-btn:hover{background:color-mix(in srgb,var(--emerald-500, #10b981) 15%,transparent);border-color:var(--emerald-500, #10b981);box-shadow:0 0 12px color-mix(in srgb,var(--emerald-500, #10b981) 20%,transparent)}.staged-diagram-trace-btn.tracing{border-color:var(--emerald-500, #10b981);background:linear-gradient(135deg,color-mix(in srgb,var(--emerald-500, #10b981) 20%,transparent),color-mix(in srgb,var(--emerald-500, #10b981) 10%,transparent));animation:pulse-glow 1.5s ease-in-out infinite}@keyframes pulse-glow{0%,to{box-shadow:0 0 8px color-mix(in srgb,var(--emerald-500) 15%,transparent)}50%{box-shadow:0 0 20px color-mix(in srgb,var(--emerald-500) 35%,transparent)}}.staged-diagram-canvas{width:100%;height:420px;position:relative}.staged-diagram-canvas .react-flow{background:transparent!important}.staged-diagram-canvas .react-flow__background{opacity:.3}.staged-diagram-canvas .react-flow__edge-path{stroke:var(--slate-500, #64748b)!important;stroke-width:1.5!important}.staged-diagram-canvas .react-flow__edge-text{fill:var(--slate-400, #94a3b8)!important;font-size:10px!important}.staged-diagram-canvas .react-flow__edge.animated .react-flow__edge-path{stroke-dasharray:5!important;animation:dash-flow 1s linear infinite!important}@keyframes dash-flow{to{stroke-dashoffset:-10}}.staged-diagram-info{padding:20px 24px;border-top:1px solid color-mix(in srgb,var(--indigo-500, #6366f1) 10%,transparent);display:flex;flex-direction:column;gap:16px}.staged-diagram-stage-title{font-size:16px;font-weight:700;color:var(--slate-100, #f1f5f9);margin:0}.staged-diagram-bottleneck{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;border-radius:12px;background:color-mix(in srgb,var(--red-500, #ef4444) 8%,transparent);border:1px solid color-mix(in srgb,var(--red-500, #ef4444) 25%,transparent)}.staged-diagram-bottleneck-icon{font-size:16px;flex-shrink:0;margin-top:1px}.staged-diagram-bottleneck-text{font-size:13px;color:color-mix(in srgb,var(--red-400, #f87171) 80%,var(--slate-200));line-height:1.5;margin:0}.staged-diagram-narrative{font-size:13.5px;line-height:1.7;color:var(--slate-300, #cbd5e1)}.staged-diagram-narrative strong{color:var(--slate-100, #f1f5f9);font-weight:600}.staged-diagram-narrative code{background:color-mix(in srgb,var(--indigo-500, #6366f1) 12%,transparent);padding:2px 6px;border-radius:4px;font-size:12px;color:var(--indigo-300, #c4b5fd)}.staged-diagram-kbd-hint{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--slate-500, #64748b);padding:8px 0 0}.staged-diagram-kbd-hint kbd{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:22px;padding:0 6px;border-radius:5px;border:1px solid var(--slate-600, #475569);background:var(--slate-800, #1e293b);color:var(--slate-300, #cbd5e1);font-size:11px;font-family:inherit;font-weight:600}.request-path-dot{position:absolute;width:14px;height:14px;border-radius:50%;background:var(--emerald-500, #10b981);box-shadow:0 0 12px var(--emerald-500, #10b981),0 0 24px color-mix(in srgb,var(--emerald-500) 50%,transparent);pointer-events:none;z-index:100;transform:translate(-50%,-50%);transition:left .5s cubic-bezier(.4,0,.2,1),top .5s cubic-bezier(.4,0,.2,1)}.request-path-dot:after{content:"";position:absolute;inset:-4px;border-radius:50%;background:color-mix(in srgb,var(--emerald-500, #10b981) 30%,transparent);animation:dot-pulse 1s ease-in-out infinite}@keyframes dot-pulse{0%,to{transform:scale(1);opacity:.6}50%{transform:scale(1.8);opacity:0}}.request-path-label{position:absolute;transform:translate(-50%,-120%);padding:4px 10px;border-radius:8px;background:var(--slate-800, #1e293b);border:1px solid var(--emerald-500, #10b981);color:var(--emerald-500, #10b981);font-size:11px;font-weight:600;white-space:nowrap;pointer-events:none;z-index:101;box-shadow:0 4px 12px #0000004d}[data-theme=light] .staged-diagram-container{background:#f8fafc;border-color:color-mix(in srgb,var(--indigo-500) 20%,transparent)}[data-theme=light] .staged-diagram-controls{background:color-mix(in srgb,var(--indigo-500) 5%,#fff);border-bottom-color:color-mix(in srgb,var(--indigo-500) 12%,transparent)}[data-theme=light] .staged-diagram-title{color:var(--slate-800)}[data-theme=light] .staged-diagram-pill{border-color:var(--slate-300);color:var(--slate-500)}[data-theme=light] .staged-diagram-pill.active{color:#fff}[data-theme=light] .arch-node-wrapper{background:linear-gradient(135deg,color-mix(in srgb,var(--node-color-1) 8%,#fff),color-mix(in srgb,var(--node-color-2) 4%,#fff));border-color:color-mix(in srgb,var(--node-color-1) 30%,transparent)}[data-theme=light] .arch-node-label{color:var(--slate-700)}[data-theme=light] .staged-diagram-stage-title{color:var(--slate-900)}[data-theme=light] .staged-diagram-narrative{color:var(--slate-600)}[data-theme=light] .staged-diagram-narrative strong{color:var(--slate-900)}[data-theme=light] .staged-diagram-info{border-top-color:color-mix(in srgb,var(--indigo-500) 12%,transparent)}[data-theme=light] .staged-diagram-kbd-hint kbd{background:var(--slate-100);border-color:var(--slate-300);color:var(--slate-600)}[data-theme=light] .request-path-label{background:#fff;box-shadow:0 4px 12px #0000001a}.case-study-interactive-page{min-height:100vh;padding:80px 20px 40px;max-width:1100px;margin:0 auto}.case-study-hero{text-align:center;padding:40px 0 32px}.case-study-hero-badge{display:inline-block;padding:6px 16px;border-radius:100px;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;background:linear-gradient(135deg,color-mix(in srgb,var(--indigo-500) 15%,transparent),color-mix(in srgb,var(--fuchsia-500, #c026d3) 10%,transparent));border:1px solid color-mix(in srgb,var(--indigo-500) 30%,transparent);color:var(--indigo-300, #c4b5fd);margin-bottom:16px}.case-study-hero-title{font-size:clamp(28px,5vw,42px);font-weight:800;letter-spacing:-.03em;line-height:1.1;color:var(--slate-100, #f1f5f9);margin:0 0 12px;background:linear-gradient(135deg,var(--slate-100),var(--indigo-300, #c4b5fd));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.case-study-hero-subtitle{font-size:16px;color:var(--slate-400, #94a3b8);margin:0 0 20px;line-height:1.5}.case-study-hero-stats{display:flex;align-items:center;justify-content:center;gap:20px}.case-study-stat{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:var(--slate-400, #94a3b8)}.case-study-stat svg{color:var(--indigo-400, #a78bfa)}.case-study-diagram-wrap{margin:0 0 32px}.case-study-back-bar{text-align:center;padding:20px 0}.case-study-back-link{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;border-radius:10px;font-size:13px;font-weight:600;color:var(--indigo-400, #a78bfa);border:1px solid color-mix(in srgb,var(--indigo-400) 25%,transparent);background:color-mix(in srgb,var(--indigo-400) 5%,transparent);text-decoration:none;transition:all .25s}.case-study-back-link:hover{background:color-mix(in srgb,var(--indigo-400) 12%,transparent);border-color:var(--indigo-400)}[data-theme=light] .case-study-hero-title{background:linear-gradient(135deg,var(--slate-900),var(--indigo-600));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}[data-theme=light] .case-study-hero-subtitle{color:var(--slate-600)}.est-calc-card{width:100%;border-radius:20px;background:var(--surface-card, #0f172a);border:1px solid color-mix(in srgb,var(--indigo-500) 15%,transparent);overflow:hidden;box-shadow:0 10px 30px #00000040;margin:32px 0}.est-calc-header{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid color-mix(in srgb,var(--indigo-500) 10%,transparent);background:color-mix(in srgb,var(--indigo-500) 3%,transparent)}.est-calc-title-group{display:flex;align-items:center;gap:10px}.est-calc-icon{font-size:20px}.est-calc-title{font-size:16px;font-weight:700;color:var(--slate-100, #f1f5f9);margin:0}.est-calc-copy-btn{padding:6px 12px;border-radius:8px;font-size:12px;font-weight:600;color:var(--indigo-400, #a78bfa);border:1px solid color-mix(in srgb,var(--indigo-400) 30%,transparent);background:transparent;cursor:pointer;transition:all .25s}.est-calc-copy-btn:hover{background:color-mix(in srgb,var(--indigo-400) 10%,transparent);border-color:var(--indigo-400)}.est-calc-body{display:grid;grid-template-columns:1.1fr 1fr;gap:0;min-height:480px}.est-calc-inputs{padding:24px;border-right:1px solid color-mix(in srgb,var(--indigo-500) 10%,transparent);display:flex;flex-direction:column;gap:24px}.est-calc-input-group{display:flex;flex-direction:column;gap:8px}.est-calc-label-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:600;color:var(--slate-300, #cbd5e1)}.est-calc-value{color:var(--indigo-400, #a78bfa);font-family:var(--font-mono, monospace);font-weight:700;background:color-mix(in srgb,var(--indigo-500) 10%,transparent);padding:2px 8px;border-radius:6px}.est-calc-slider{-webkit-appearance:none;width:100%;height:6px;border-radius:3px;background:var(--slate-700, #334155);outline:none;cursor:pointer;margin:8px 0}.est-calc-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,var(--indigo-400),var(--indigo-600));cursor:pointer;box-shadow:0 0 10px #6366f166;-webkit-transition:transform .1s;transition:transform .1s}.est-calc-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.est-calc-slider-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--slate-500, #64748b)}.est-calc-results{padding:24px;background:color-mix(in srgb,var(--slate-950, #020617) 40%,transparent);display:flex;flex-direction:column;gap:24px}.est-calc-result-section{display:flex;flex-direction:column;gap:12px}.est-calc-section-title{font-size:12px;font-weight:700;color:var(--slate-400, #94a3b8);text-transform:uppercase;letter-spacing:.05em;margin:0}.est-calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.est-calc-result-card{padding:14px 16px;border-radius:12px;background:color-mix(in srgb,var(--slate-800, #1e293b) 50%,transparent);border:1px solid color-mix(in srgb,var(--slate-700, #334155) 30%,transparent);display:flex;flex-direction:column;gap:4px;justify-content:center}.est-calc-result-label{font-size:11px;font-weight:500;color:var(--slate-400, #94a3b8)}.est-calc-result-val{font-size:15px;font-weight:700;color:var(--slate-100, #f1f5f9);font-family:var(--font-mono, monospace)}.est-calc-result-val .highlight-val{color:var(--indigo-400, #a78bfa)}.est-calc-result-card.cache-recommendation{grid-column:span 2;border-color:color-mix(in srgb,var(--emerald-500) 25%,transparent);background:color-mix(in srgb,var(--emerald-500) 4%,transparent)}.est-calc-result-val.green-val{color:var(--emerald-400, #34d399)}.est-calc-result-desc{font-size:10px;color:var(--slate-500, #64748b);margin-top:2px}.est-calc-result-card.total-storage{grid-column:span 2;border-color:color-mix(in srgb,var(--orange-500) 25%,transparent);background:color-mix(in srgb,var(--orange-500) 4%,transparent)}.est-calc-result-val.orange-val{color:var(--orange-400, #fb923c)}[data-theme=light] .est-calc-card{background:#fff;box-shadow:0 10px 30px #0000000f}[data-theme=light] .est-calc-title{color:var(--slate-800)}[data-theme=light] .est-calc-label-row{color:var(--slate-600)}[data-theme=light] .est-calc-value{color:var(--indigo-600)}[data-theme=light] .est-calc-slider{background:var(--slate-200)}[data-theme=light] .est-calc-result-val{color:var(--slate-800)}[data-theme=light] .est-calc-result-val .highlight-val{color:var(--indigo-600)}[data-theme=light] .est-calc-result-val.green-val{color:var(--green-600)}[data-theme=light] .est-calc-result-val.orange-val{color:var(--orange-600)}[data-theme=light] .est-calc-result-card{background:var(--slate-50);border-color:var(--slate-200)}[data-theme=light] .est-calc-results{background:#f8fafc}.class-diagram-container{width:100%;height:500px;background:var(--surface-diagram, #0a0f1e);border:1px solid color-mix(in srgb,var(--indigo-500) 15%,transparent);border-radius:20px;overflow:hidden;position:relative;margin:24px 0}.class-diagram-container .react-flow{background:transparent!important}.class-diagram-container .react-flow__background{opacity:.3}.class-node-card{width:220px;background:var(--surface-card, #1e293b);border:1.5px solid color-mix(in srgb,var(--slate-500) 40%,transparent);border-radius:12px;overflow:hidden;box-shadow:0 4px 12px #00000026;font-family:"JetBrains Mono",var(--font-mono, monospace);font-size:11px;color:var(--slate-200, #e2e8f0)}.class-node-card:hover{border-color:var(--indigo-400, #a78bfa);box-shadow:0 4px 20px color-mix(in srgb,var(--indigo-400) 15%,transparent)}.class-node-header{padding:8px 12px;background:color-mix(in srgb,var(--slate-500) 15%,transparent);border-bottom:1.5px solid color-mix(in srgb,var(--slate-500) 30%,transparent);display:flex;flex-direction:column;align-items:center;gap:2px}.class-node-header.interface{background:color-mix(in srgb,var(--fuchsia-500) 12%,transparent);border-bottom-color:color-mix(in srgb,var(--fuchsia-500) 30%,transparent)}.class-node-header.abstract{background:color-mix(in srgb,var(--indigo-500) 12%,transparent);border-bottom-color:color-mix(in srgb,var(--indigo-500) 30%,transparent)}.class-node-stereotype{font-size:9px;font-weight:700;text-transform:uppercase;color:var(--indigo-400, #a78bfa);letter-spacing:.05em}.class-node-header.interface .class-node-stereotype{color:var(--fuchsia-400, #f0abfc)}.class-node-name{font-weight:700;font-size:12px;color:var(--slate-100, #f1f5f9)}.class-node-section{padding:8px 12px;display:flex;flex-direction:column;gap:4px}.class-node-section.fields{border-bottom:1.5px solid color-mix(in srgb,var(--slate-500) 20%,transparent)}.class-node-item{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.4}.class-node-item .visibility{font-weight:700;color:var(--indigo-400, #a78bfa)}.class-node-item .name{color:var(--slate-200, #cbd5e1)}.class-node-item .type{color:var(--cyan-400, #7dd3fc)}.class-node-handle{width:8px!important;height:8px!important;background:var(--slate-500, #64748b)!important;border:2px solid var(--surface-card, #1e293b)!important;border-radius:50%!important;opacity:0;transition:opacity .2s}.class-node-card:hover .class-node-handle{opacity:1}[data-theme=light] .class-diagram-container{background:#f8fafc;border-color:color-mix(in srgb,var(--indigo-500) 20%,transparent)}[data-theme=light] .class-node-card{background:#fff;border-color:var(--slate-200);box-shadow:0 4px 12px #0000000a;color:var(--slate-700)}[data-theme=light] .class-node-name{color:var(--slate-800)}[data-theme=light] .class-node-item .name{color:var(--slate-700)}[data-theme=light] .class-node-item .type{color:var(--blue-600)}[data-theme=light] .class-node-item .visibility{color:var(--indigo-600)}[data-theme=light] .class-node-handle{border-color:#fff!important}.sys-hub-container{min-height:100vh;padding:90px 24px 60px;max-width:1200px;margin:0 auto}.sys-hub-hero{text-align:center;padding:40px 0;max-width:800px;margin:0 auto;display:flex;flex-direction:column;align-items:center}.sys-hub-badge{display:inline-block;padding:6px 16px;border-radius:100px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;background:color-mix(in srgb,var(--indigo-500) 15%,transparent);border:1px solid color-mix(in srgb,var(--indigo-500) 30%,transparent);color:var(--indigo-400, #a78bfa);margin-bottom:16px}.sys-hub-title{font-size:clamp(32px,6vw,48px);font-weight:900;letter-spacing:-.03em;line-height:1.1;color:var(--slate-100, #f1f5f9);margin:0 0 16px;background:linear-gradient(135deg,var(--slate-100),var(--indigo-400, #a78bfa));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.sys-hub-subtitle{font-size:16px;color:var(--slate-400, #94a3b8);line-height:1.6;margin:0 0 32px}.sys-hub-stats-row{display:inline-flex;align-items:center;gap:24px;padding:12px 32px;background:color-mix(in srgb,var(--slate-800) 40%,transparent);border:1px solid color-mix(in srgb,var(--slate-700) 30%,transparent);border-radius:16px}.sys-hub-stat-item{display:flex;flex-direction:column;align-items:center}.stat-num{font-size:24px;font-weight:800;color:var(--indigo-400, #a78bfa);line-height:1.1}.stat-lbl{font-size:11px;font-weight:600;color:var(--slate-400, #94a3b8);margin-top:4px;text-transform:uppercase;letter-spacing:.05em}.sys-hub-divider{width:1px;height:28px;background:color-mix(in srgb,var(--slate-700) 50%,transparent)}.sys-hub-tabs{display:flex;justify-content:center;gap:8px;margin:24px 0 40px;border-bottom:1.5px solid color-mix(in srgb,var(--slate-700) 30%,transparent);padding-bottom:12px}.sys-hub-tab-btn{padding:10px 20px;border-radius:10px;font-size:13.5px;font-weight:600;color:var(--slate-400, #94a3b8);background:transparent;border:1px solid transparent;cursor:pointer;transition:all .25s}.sys-hub-tab-btn:hover{color:var(--slate-200);background:color-mix(in srgb,var(--slate-800) 40%,transparent)}.sys-hub-tab-btn.active{color:var(--indigo-400, #a78bfa);background:color-mix(in srgb,var(--indigo-500) 8%,transparent);border-color:color-mix(in srgb,var(--indigo-500) 25%,transparent)}.sys-hub-panel{display:flex;flex-direction:column;gap:32px;animation:fadeIn .4s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.panel-header{border-left:3px solid var(--indigo-500);padding-left:14px}.panel-header h2{font-size:20px;font-weight:800;color:var(--slate-100, #f1f5f9);margin:0 0 6px;letter-spacing:-.01em}.panel-header p{font-size:13.5px;color:var(--slate-400, #94a3b8);margin:0}.sys-hub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.sys-hub-card{border-radius:16px;background:var(--surface-card, #0f172a);border:1px solid color-mix(in srgb,var(--slate-700) 40%,transparent);padding:20px;display:flex;flex-direction:column;gap:12px;position:relative;transition:all .3s}.sys-hub-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--slate-600) 50%,transparent);box-shadow:0 10px 20px #00000026}.sys-hub-card.interactive-card{border-color:color-mix(in srgb,var(--indigo-500) 30%,transparent);background:linear-gradient(180deg,var(--surface-card, #0f172a),color-mix(in srgb,var(--indigo-500) 3%,transparent))}.sys-hub-card.interactive-card:hover{border-color:var(--indigo-500);box-shadow:0 10px 25px color-mix(in srgb,var(--indigo-500) 10%,transparent)}.sys-hub-card.lld-interactive-card{border-color:color-mix(in srgb,var(--fuchsia-500) 30%,transparent);background:linear-gradient(180deg,var(--surface-card, #0f172a),color-mix(in srgb,var(--fuchsia-500) 3%,transparent))}.sys-hub-card.lld-interactive-card:hover{border-color:var(--fuchsia-500);box-shadow:0 10px 25px color-mix(in srgb,var(--fuchsia-500) 10%,transparent)}.card-badge-wrap{display:flex;margin-bottom:-4px}.card-badge{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:3px 8px;border-radius:6px;background:color-mix(in srgb,var(--indigo-500) 12%,transparent);color:var(--indigo-400, #a78bfa);border:1px solid color-mix(in srgb,var(--indigo-500) 25%,transparent)}.card-badge.lld{background:color-mix(in srgb,var(--fuchsia-500) 12%,transparent);color:var(--fuchsia-400, #f0abfc);border-color:color-mix(in srgb,var(--fuchsia-500) 25%,transparent)}.card-title{font-size:15px;font-weight:700;color:var(--slate-100, #f1f5f9);margin:0}.card-desc{font-size:12.5px;color:var(--slate-400, #94a3b8);line-height:1.5;margin:0;flex-grow:1}.card-desc code{background:color-mix(in srgb,var(--slate-700) 30%,transparent);padding:1px 5px;border-radius:4px;font-size:11px}.card-footer{margin-top:8px}.card-action-btn{display:inline-flex;align-items:center;justify-content:center;width:100%;padding:8px 16px;border-radius:8px;font-size:12px;font-weight:600;text-decoration:none;transition:all .2s}.card-action-btn.primary{background:linear-gradient(135deg,var(--indigo-600),var(--indigo-500));color:#fff;box-shadow:0 4px 12px color-mix(in srgb,var(--indigo-500) 20%,transparent)}.card-action-btn.primary:hover{transform:translateY(-1px);box-shadow:0 4px 16px color-mix(in srgb,var(--indigo-500) 30%,transparent)}.card-action-btn.primary.lld-btn{background:linear-gradient(135deg,var(--fuchsia-600),var(--fuchsia-500));box-shadow:0 4px 12px color-mix(in srgb,var(--fuchsia-500) 20%,transparent)}.card-action-btn.primary.lld-btn:hover{box-shadow:0 4px 16px color-mix(in srgb,var(--fuchsia-500) 30%,transparent)}.card-action-btn.secondary{border:1px solid color-mix(in srgb,var(--slate-500) 30%,transparent);color:var(--slate-300, #cbd5e1);background:transparent}.card-action-btn.secondary:hover{background:color-mix(in srgb,var(--slate-500) 8%,transparent);color:var(--slate-100)}.sys-hub-course-box{padding:24px;border-radius:16px;background:color-mix(in srgb,var(--slate-800) 15%,transparent);border:1px solid color-mix(in srgb,var(--slate-700) 20%,transparent);display:flex;flex-direction:column;gap:16px}.sys-hub-course-box h3{font-size:15px;font-weight:700;color:var(--slate-100, #f1f5f9);margin:0}.sys-hub-course-box p{font-size:13px;color:var(--slate-400, #94a3b8);margin:0}.course-links-grid{display:flex;flex-wrap:wrap;gap:8px}.course-link-chip{padding:6px 12px;border-radius:8px;font-size:12px;font-weight:600;color:var(--slate-300, #cbd5e1);background:color-mix(in srgb,var(--slate-800) 40%,transparent);border:1px solid color-mix(in srgb,var(--slate-700) 30%,transparent);text-decoration:none;transition:all .2s}.course-link-chip:hover{color:var(--indigo-400, #a78bfa);border-color:var(--indigo-400);background:color-mix(in srgb,var(--indigo-500) 6%,transparent)}[data-theme=light] .sys-hub-title{background:linear-gradient(135deg,var(--slate-900),var(--indigo-600));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}[data-theme=light] .sys-hub-subtitle{color:var(--slate-600)}[data-theme=light] .sys-hub-stats-row{background:#f1f5f9;border-color:var(--slate-200)}[data-theme=light] .sys-hub-stat-item .stat-num{color:var(--indigo-600)}[data-theme=light] .sys-hub-divider{background:var(--slate-300)}[data-theme=light] .sys-hub-tab-btn{color:var(--slate-600)}[data-theme=light] .sys-hub-tab-btn:hover{background:var(--slate-100)}[data-theme=light] .sys-hub-tab-btn.active{color:var(--indigo-600);background:color-mix(in srgb,var(--indigo-500) 8%,transparent);border-color:color-mix(in srgb,var(--indigo-500) 25%,transparent)}[data-theme=light] .sys-hub-card{background:#fff;border-color:var(--slate-200);box-shadow:0 4px 12px #00000008}[data-theme=light] .sys-hub-card:hover{box-shadow:0 10px 20px #0000000d}[data-theme=light] .card-title{color:var(--slate-800)}[data-theme=light] .card-desc{color:var(--slate-600)}[data-theme=light] .card-action-btn.secondary{border-color:var(--slate-300);color:var(--slate-600)}[data-theme=light] .card-action-btn.secondary:hover{background:var(--slate-100)}[data-theme=light] .sys-hub-course-box{background:var(--slate-50);border-color:var(--slate-200)}[data-theme=light] .sys-hub-course-box h3{color:var(--slate-800)}[data-theme=light] .course-link-chip{background:#fff;border-color:var(--slate-200);color:var(--slate-600)}[data-theme=light] .course-link-chip:hover{color:var(--indigo-600);border-color:var(--indigo-600);background:color-mix(in srgb,var(--indigo-500) 6%,#fff)}.db-wizard-card{width:100%;border-radius:20px;background:var(--surface-card, #0f172a);border:1px solid color-mix(in srgb,var(--indigo-500) 15%,transparent);overflow:hidden;box-shadow:0 10px 30px #00000040;margin:32px 0;padding:28px}.db-wizard-header{display:flex;align-items:flex-start;gap:16px;margin-bottom:24px}.db-wizard-icon{font-size:28px;flex-shrink:0}.db-wizard-title{font-size:18px;font-weight:800;color:var(--slate-100, #f1f5f9);margin:0 0 4px}.db-wizard-subtitle{font-size:13px;color:var(--slate-400, #94a3b8);margin:0}.db-wizard-body{min-height:320px;display:flex;flex-direction:column}.db-wizard-step{display:flex;flex-direction:column;gap:20px}.db-wizard-progress-bar{width:100%;height:4px;background:var(--slate-700, #334155);border-radius:2px;overflow:hidden}.db-wizard-progress-fill{height:100%;background:linear-gradient(90deg,var(--indigo-500),var(--fuchsia-500));transition:width .3s ease}.db-wizard-question-title{font-size:15px;font-weight:700;color:var(--slate-200, #e2e8f0);margin:8px 0 0}.db-wizard-options{display:flex;flex-direction:column;gap:10px}.db-wizard-option-btn{text-align:left;padding:14px 20px;border-radius:12px;background:color-mix(in srgb,var(--slate-800) 40%,transparent);border:1.5px solid color-mix(in srgb,var(--slate-700) 30%,transparent);cursor:pointer;transition:all .25s;display:flex;flex-direction:column;gap:4px}.db-wizard-option-btn:hover{transform:translate(4px);border-color:var(--indigo-500);background:color-mix(in srgb,var(--indigo-500) 5%,transparent)}.db-wizard-option-btn:active{transform:scale(.995)}.db-wizard-option-btn .option-label{font-size:13.5px;font-weight:700;color:var(--slate-100, #f1f5f9)}.db-wizard-option-btn .option-desc{font-size:11.5px;color:var(--slate-400, #94a3b8)}.db-wizard-result{display:flex;flex-direction:column;gap:16px;animation:fadeIn .4s ease-out}.result-badge{display:inline-block;align-self:flex-start;padding:4px 10px;border-radius:6px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;background:color-mix(in srgb,var(--emerald-500) 12%,transparent);border:1px solid color-mix(in srgb,var(--emerald-500) 25%,transparent);color:var(--emerald-400, #34d399)}.result-tech{font-size:26px;font-weight:900;color:var(--indigo-400, #a78bfa);margin:0;background:linear-gradient(135deg,var(--indigo-300),var(--fuchsia-300));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.result-type{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--slate-400, #94a3b8);margin-top:-8px}.result-why{font-size:13.5px;line-height:1.6;color:var(--slate-200, #cbd5e1);background:color-mix(in srgb,var(--slate-800) 30%,transparent);padding:14px 16px;border-radius:12px;border-left:3px solid var(--indigo-500)}.result-pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:20px}.pros-block,.cons-block{display:flex;flex-direction:column;gap:10px}.block-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--slate-400, #94a3b8)}.pros-block ul,.cons-block ul{padding-left:18px;margin:0;display:flex;flex-direction:column;gap:6px}.pros-block li,.cons-block li{font-size:12.5px;color:var(--slate-300, #cbd5e1);line-height:1.4}.db-wizard-restart-btn{align-self:flex-start;padding:10px 20px;border-radius:10px;font-size:13px;font-weight:600;color:var(--slate-300);border:1px solid color-mix(in srgb,var(--slate-500) 30%,transparent);background:transparent;cursor:pointer;transition:all .25s;margin-top:12px}.db-wizard-restart-btn:hover{background:color-mix(in srgb,var(--slate-500) 8%,transparent);border-color:var(--slate-400);color:var(--slate-100)}[data-theme=light] .db-wizard-card{background:#fff;border-color:var(--slate-200);box-shadow:0 10px 30px #0000000f}[data-theme=light] .db-wizard-title,[data-theme=light] .db-wizard-question-title{color:var(--slate-800)}[data-theme=light] .db-wizard-option-btn{background:var(--slate-50);border-color:var(--slate-200)}[data-theme=light] .db-wizard-option-btn:hover{background:color-mix(in srgb,var(--indigo-500) 4%,#fff);border-color:var(--indigo-600)}[data-theme=light] .db-wizard-option-btn .option-label{color:var(--slate-800)}[data-theme=light] .db-wizard-option-btn .option-desc{color:var(--slate-500)}[data-theme=light] .result-tech{background:linear-gradient(135deg,var(--indigo-600),var(--fuchsia-600));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}[data-theme=light] .result-why{background:var(--slate-50);color:var(--slate-700)}[data-theme=light] .pros-block li,[data-theme=light] .cons-block li{color:var(--slate-600)}[data-theme=light] .db-wizard-restart-btn{border-color:var(--slate-300);color:var(--slate-600)}[data-theme=light] .db-wizard-restart-btn:hover{background:var(--slate-100);color:var(--slate-800)}.sys-hub-cheatsheet-container{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:16px}.sys-hub-cheatsheet-card{border-radius:16px;background:var(--surface-card, #0f172a);border:1px solid color-mix(in srgb,var(--indigo-500) 12%,transparent);padding:20px;box-shadow:0 4px 12px #0000001a}.cheatsheet-card-title{font-size:13.5px;font-weight:700;color:var(--slate-200, #cbd5e1);margin:0 0 16px}.cheatsheet-table-wrap{width:100%;overflow-x:auto}.cheatsheet-table{width:100%;border-collapse:collapse;font-size:12px;text-align:left}.cheatsheet-table th,.cheatsheet-table td{padding:8px 12px;border-bottom:1px solid color-mix(in srgb,var(--slate-700) 30%,transparent)}.cheatsheet-table th{font-weight:700;color:var(--slate-400, #94a3b8);text-transform:uppercase;font-size:10px;letter-spacing:.05em}.cheatsheet-table td{color:var(--slate-300, #cbd5e1)}.cheatsheet-table td.mono-val{font-family:var(--font-mono, monospace);font-weight:700;color:var(--indigo-400, #a78bfa)}.cheatsheet-table td.green-val{font-family:var(--font-mono, monospace);font-weight:700;color:var(--emerald-400, #34d399)}.cheatsheet-table td.gold-val{font-family:var(--font-mono, monospace);font-weight:700;color:var(--amber-400, #fbbf24)}[data-theme=light] .sys-hub-cheatsheet-card{background:#fff;border-color:var(--slate-200);box-shadow:0 4px 12px #00000008}[data-theme=light] .cheatsheet-card-title{color:var(--slate-800)}[data-theme=light] .cheatsheet-table th{color:var(--slate-500)}[data-theme=light] .cheatsheet-table td{color:var(--slate-700);border-bottom-color:var(--slate-100)}[data-theme=light] .cheatsheet-table td.mono-val{color:var(--indigo-600)}[data-theme=light] .cheatsheet-table td.green-val{color:var(--green-600)}[data-theme=light] .cheatsheet-table td.gold-val{color:var(--amber-600)}@media(max-width:768px){.staged-diagram-canvas{height:320px}.staged-diagram-controls{padding:12px 14px}.staged-diagram-pill{width:32px;height:32px;font-size:12px}.staged-diagram-trace-btn{padding:6px 12px;font-size:11px}.staged-diagram-info{padding:16px}.staged-diagram-narrative{font-size:13px}.case-study-interactive-page{padding:70px 12px 24px}.case-study-hero{padding:24px 0}.case-study-hero-stats{flex-direction:column;gap:8px}}
