.diagram-page.svelte-1w9bt1x{min-height:100vh;background:#f8f9fa;padding:2rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.diagram-header.svelte-1w9bt1x{max-width:900px;margin:0 auto 2rem}.back-link.svelte-1w9bt1x{color:#ff6b35;text-decoration:none;font-size:.9rem}.back-link.svelte-1w9bt1x:hover{text-decoration:underline}h1.svelte-1w9bt1x{font-size:2rem;margin:1rem 0 .5rem;color:#000}.diagram-header.svelte-1w9bt1x p:where(.svelte-1w9bt1x){color:#666;margin:0}.diagram-container.svelte-1w9bt1x{max-width:900px;margin:0 auto;padding:2rem;background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:.5rem}.flow-step.svelte-1w9bt1x{position:relative}.step-number.svelte-1w9bt1x{position:absolute;top:-10px;left:-10px;background:#ff6b35;color:#fff;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;z-index:1}.step-box.svelte-1w9bt1x{padding:1.25rem 1.5rem;border-radius:12px;text-align:center;min-width:140px}.browser-box.svelte-1w9bt1x{background:#f0f9ff;border:2px solid #bae6fd}.mcpaas-box.svelte-1w9bt1x{background:#1a1a1a;border:2px solid #333}.mcpaas-box.svelte-1w9bt1x .step-title:where(.svelte-1w9bt1x),.mcpaas-box.svelte-1w9bt1x .step-desc:where(.svelte-1w9bt1x){color:#fff}.mcpaas-box.svelte-1w9bt1x .step-details:where(.svelte-1w9bt1x) span:where(.svelte-1w9bt1x){background:#ffffff26;color:#ccc}.grok-box.svelte-1w9bt1x{background:linear-gradient(135deg,#059669,#10b981);border:2px solid #047857}.grok-box.svelte-1w9bt1x .step-icon:where(.svelte-1w9bt1x),.grok-box.svelte-1w9bt1x .step-title:where(.svelte-1w9bt1x),.grok-box.svelte-1w9bt1x .step-desc:where(.svelte-1w9bt1x){color:#fff}.grok-box.svelte-1w9bt1x .step-details:where(.svelte-1w9bt1x) span:where(.svelte-1w9bt1x){background:#ffffff40;color:#fff}.step-icon.svelte-1w9bt1x{font-size:1.5rem;margin-bottom:.25rem}.grok-box.svelte-1w9bt1x .step-icon:where(.svelte-1w9bt1x){font-family:SF Mono,monospace;font-weight:700}.step-title.svelte-1w9bt1x{font-weight:700;font-size:1rem;color:#000}.step-desc.svelte-1w9bt1x{font-size:.8rem;color:#666;margin-top:.25rem}.step-details.svelte-1w9bt1x{display:flex;gap:.5rem;margin-top:.5rem;justify-content:center;flex-wrap:wrap}.step-details.svelte-1w9bt1x span:where(.svelte-1w9bt1x){background:#e0f2fe;color:#0369a1;padding:.2rem .5rem;border-radius:4px;font-size:.7rem;font-weight:500}.flow-connector.svelte-1w9bt1x{display:flex;flex-direction:column;align-items:center;gap:.25rem}.connector-line.horizontal.svelte-1w9bt1x{width:50px;height:3px;background:#ff6b35;border-radius:2px;position:relative}.connector-line.horizontal.svelte-1w9bt1x:after{content:"→";position:absolute;right:-8px;top:50%;transform:translateY(-50%);color:#ff6b35;font-size:1rem;font-weight:700}.connector-label.svelte-1w9bt1x{font-size:.65rem;color:#888;white-space:nowrap}.result-section.svelte-1w9bt1x{width:100%;margin-top:2rem;padding-top:1.5rem;border-top:2px dashed #e5e7eb}.result-header.svelte-1w9bt1x{text-align:center;font-weight:700;font-size:.9rem;color:#16a34a;letter-spacing:.05em;margin-bottom:1rem}.result-grid.svelte-1w9bt1x{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.result-item.svelte-1w9bt1x{background:#f0fdf4;border:2px solid #bbf7d0;border-radius:8px;padding:1rem 1.5rem;text-align:center;min-width:130px}.result-label.svelte-1w9bt1x{font-size:.75rem;color:#166534;font-weight:500}.result-value.svelte-1w9bt1x{font-size:1.25rem;font-weight:700;color:#15803d;margin-top:.25rem}.demo-section.svelte-1w9bt1x{width:100%;margin-top:1.5rem;padding-top:1.5rem;border-top:2px dashed #e5e7eb}.demo-header.svelte-1w9bt1x{text-align:center;font-weight:700;font-size:.9rem;color:#666;letter-spacing:.05em;margin-bottom:1rem}.demo-acts.svelte-1w9bt1x{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.demo-act.svelte-1w9bt1x{padding:1rem 1.25rem;border-radius:8px;text-align:center;min-width:140px}.act-problem.svelte-1w9bt1x{background:#fef2f2;border:2px solid #fecaca}.act-problem.svelte-1w9bt1x .act-number:where(.svelte-1w9bt1x){color:#dc2626}.act-transition.svelte-1w9bt1x{background:#fefce8;border:2px solid #fef08a}.act-transition.svelte-1w9bt1x .act-number:where(.svelte-1w9bt1x){color:#ca8a04}.act-success.svelte-1w9bt1x{background:#f0fdf4;border:2px solid #bbf7d0}.act-success.svelte-1w9bt1x .act-number:where(.svelte-1w9bt1x){color:#16a34a}.act-number.svelte-1w9bt1x{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.act-title.svelte-1w9bt1x{font-weight:700;font-size:.95rem;color:#000;margin-top:.25rem}.act-desc.svelte-1w9bt1x{font-size:.8rem;color:#666;margin-top:.25rem}@media (max-width: 768px){.diagram-container.svelte-1w9bt1x{flex-direction:column}.flow-connector.svelte-1w9bt1x{transform:rotate(90deg);margin:.5rem 0}.connector-line.horizontal.svelte-1w9bt1x{width:30px}}
