html,body{color:#0f172a;background:radial-gradient(circle at top,#f1eff9,#e7e2ec 55%,#f8fafc);margin:0;padding:0;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}pre{white-space:pre-wrap;word-break:break-word;margin:0}button,input{font:inherit}.demo-page{color:#0f172a;background:0 0;min-height:100vh;padding:24px}.demo-shell{flex-direction:column;gap:24px;max-width:1280px;margin:0 auto;display:flex}.demo-grid{grid-template-columns:1.2fr .8fr;gap:24px;display:grid}.side-stack,.stack{flex-direction:column;gap:16px;display:flex}.card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffd1;border:1px solid #bdb4bf8c;border-radius:24px;box-shadow:0 10px 30px #0f172a1a}.card-body{padding:24px}.hero-top{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.badge{color:#fff;background:#473198;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:700;display:inline-flex}.hero-title{letter-spacing:-.03em;margin:12px 0 8px;font-size:48px;font-weight:700;line-height:1.05}.hero-copy{color:#475569;max-width:760px;margin:0;font-size:15px;line-height:1.6}.hero-sub{color:#64748b;margin-top:8px;font-size:16px}.hero-chip{color:#475569;white-space:nowrap;background:#ffffffe6;border:1px solid #bdb4bf;border-radius:16px;align-items:center;gap:8px;padding:10px 14px;font-size:14px;display:inline-flex}.agent-box,.log-box{background:#ffffffe0;border:1px solid #bdb4bf;border-radius:18px;margin-top:20px;padding:16px}.section-label{color:#334155;align-items:center;gap:8px;margin-bottom:10px;font-size:14px;font-weight:700;display:flex}.section-title{margin:0 0 16px;font-size:24px;font-weight:700}.section-title-sm{color:#334155;margin:0 0 16px;font-size:14px;font-weight:700}.input-row{gap:12px;display:flex}.prompt-input{background:#fff;border:1px solid #bdb4bf;border-radius:16px;outline:none;flex:1;height:48px;padding:0 16px;font-size:14px}.prompt-input:focus{border-color:#473198;box-shadow:0 0 0 3px #4731981f}.button-row{gap:8px;display:flex}.btn{cursor:pointer;border:1px solid #0000;border-radius:16px;height:48px;padding:0 18px;font-weight:600}.btn:disabled{opacity:.6;cursor:default}.btn-primary{color:#fff;background:#473198}.btn-secondary{color:#334155;background:#fff;border-color:#bdb4bf}.pill-row{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.step-pill{color:#64748b;background:#fff;border:1px solid #bdb4bf;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600}.step-pill-done{color:#1e293b;background:#f1f5f9;border-color:#bdb4bf}.step-pill-active{color:#fff;background:#473198;border-color:#473198}.log-item{background:#f8fafc;border:1px solid #bdb4bf;border-radius:18px;padding:16px}.log-item-active{color:#fff;background:#473198;border-color:#473198}.log-inner{align-items:flex-start;gap:12px;display:flex}.log-index{color:#fff;background:#473198;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;font-size:12px;font-weight:700;display:flex}.log-index-active{color:#473198;background:#fff}.log-content{flex:1;min-width:0}.log-header{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.log-label{font-weight:700}.log-text{color:#475569;margin:6px 0 0;font-size:14px;line-height:1.5}.log-text-active{color:#ddd6fe}.endpoint-tag{color:#334155;background:#e2e8f0;border-radius:999px;padding:3px 8px;font-family:Consolas,monospace;font-size:12px}.endpoint-tag-active{color:#fff;background:#ffffff24}.chev{color:#94a3b8;flex-shrink:0}.chev-active{color:#ddd6fe}.empty-state{text-align:center;color:#64748b;border:1px dashed #bdb4bf;border-radius:18px;padding:32px;font-size:14px}.endpoint-card{background:#fffffff2;border:1px solid #bdb4bf;border-radius:18px;padding:16px}.endpoint-card-active{color:#fff;background:#473198;border-color:#473198;box-shadow:0 10px 24px #47319840}.endpoint-card-active-red{color:#fff;background:#ef2828;border-color:#ef2828;box-shadow:0 10px 24px #ef282840}.endpoint-top{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.endpoint-left{align-items:flex-start;gap:12px;display:flex}.endpoint-icon{color:#473198;background:#f1f5f9;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.endpoint-icon-active{color:#473198;background:#fff}.endpoint-name{font-family:Consolas,monospace;font-size:14px;font-weight:700}.endpoint-desc{color:#475569;margin-top:4px;font-size:14px}.endpoint-desc-active{color:#e9e4f5}.status-badge{color:#334155;background:#f1f5f9;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:600}.status-badge-active{color:#fff;background:#ffffff24}.json-box{color:#334155;background:#f8fafc;border-radius:16px;padding:12px;font-size:12px;line-height:1.55;overflow-x:auto}.json-box-active{color:#f8fafc;background:#ffffff1a}.info-card{background:#f8fafc;border:1px solid #bdb4bf61;border-radius:18px;padding:16px}.info-title{color:#0f172a;margin-bottom:6px;font-weight:700}.info-text{color:#475569;font-size:14px;line-height:1.5}.upgrade-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px;display:grid}@media (max-width:1080px){.demo-grid{grid-template-columns:1fr}.hero-top{flex-direction:column}.hero-chip{white-space:normal}}@media (max-width:720px){.demo-page{padding:16px}.hero-title{font-size:32px}.input-row{flex-direction:column}.button-row{width:100%}.btn{flex:1}.upgrade-grid{grid-template-columns:1fr}}