:root{--demo-bg: #f3f5f4;--demo-panel-bg: rgba(255, 255, 255, .85);--demo-border: rgba(16, 185, 129, .16);--demo-border-hover: rgba(16, 185, 129, .35);--demo-text: #0b1f19;--demo-text-muted: #047857;--demo-accent: #10b981;--demo-accent-blue: #0284c7;--demo-accent-orange: #d97706;--demo-accent-red: #dc2626}.demo-overlay{position:relative;width:100%;height:100%;background:var(--demo-bg);z-index:1;opacity:0;pointer-events:none;transition:opacity .4s cubic-bezier(.16,1,.3,1);color:var(--demo-text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:flex;flex-direction:column}.demo-overlay.active{opacity:1;pointer-events:auto}.demo-header{background:#fffffff2;border-bottom:1px solid var(--demo-border);padding:8px 24px;display:flex;justify-content:space-between;align-items:center}.demo-logo-section{display:flex;align-items:center;gap:10px}.demo-logo-icon{width:26px;height:26px;background:linear-gradient(135deg,var(--demo-accent) 0%,var(--demo-accent-blue) 100%);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:.85rem}.demo-title-box h2{font-size:.95rem;font-weight:700;margin:0;color:#064e3b}.demo-title-box p{display:none}.demo-badge{background:#10b9811a;border:1px solid var(--demo-accent);color:var(--demo-accent);padding:2px 8px;font-size:.68rem;border-radius:4px;font-weight:700}.demo-body{flex:1;display:grid;grid-template-columns:1.15fr .85fr;grid-template-rows:auto auto 1fr auto;gap:10px;padding:10px 20px;overflow:hidden}.demo-control-bar{grid-column:1 / -1;background:var(--demo-panel-bg);border:1px solid var(--demo-border);border-radius:8px;padding:6px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px}.demo-upload-section{display:flex;align-items:center;gap:10px;flex:1}.demo-file-label{background:linear-gradient(135deg,#10b98114,#0284c714);border:1px dashed var(--demo-accent);color:var(--demo-accent-blue);padding:5px 12px;border-radius:6px;cursor:pointer;font-size:.78rem;font-weight:600;transition:all .2s;display:flex;align-items:center;gap:6px}.demo-file-label:hover{background:linear-gradient(135deg,#10b98126,#0284c726);border-color:var(--demo-accent);color:var(--demo-text)}.demo-file-input{display:none}.demo-preset-btn{background:#00000008;border:1px solid rgba(0,0,0,.08);color:var(--demo-text);padding:5px 12px;border-radius:6px;cursor:pointer;font-size:.78rem;font-weight:500;transition:all .2s}.demo-preset-btn:hover{background:#0000000f;border-color:#00000026}.demo-action-btn{background:linear-gradient(135deg,var(--demo-accent) 0%,#059669 100%);color:#fff;border:none;padding:5px 14px;border-radius:6px;cursor:pointer;font-size:.78rem;font-weight:600;transition:all .2s;display:flex;align-items:center;gap:6px;box-shadow:0 2px 6px #10b98133}.demo-preset-btn:hover{background:#00000012;border-color:var(--demo-accent-blue)}.demo-action-btn{background:linear-gradient(135deg,#10b981,#0284c7);border:none;color:#fff;padding:11px 24px;border-radius:8px;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .2s;display:flex;align-items:center;gap:8px;box-shadow:0 3px 10px #10b98126}.demo-action-btn:hover{filter:brightness(1.05);box-shadow:0 4px 15px #10b9814d}.demo-action-btn:disabled{background:#e4e4e7!important;color:#a1a1aa!important;cursor:not-allowed!important;box-shadow:none!important}.demo-export-btn{background:#0284c70f;border:1px solid rgba(2,132,199,.2);color:#0284c7;padding:10px 18px;border-radius:8px;cursor:pointer;font-size:.88rem;font-weight:600;transition:all .2s;display:flex;align-items:center;gap:8px}.demo-export-btn:hover:not(:disabled){background:#0284c726;border-color:var(--demo-accent-blue);color:#0369a1}.demo-export-btn:disabled{opacity:.4;cursor:not-allowed}.demo-left-panel{background:var(--demo-panel-bg);border:1px solid var(--demo-border);border-radius:12px;padding:20px;display:flex;flex-direction:column;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 20px #00000005}.demo-panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;border-bottom:1px solid rgba(0,0,0,.05);padding-bottom:10px}.demo-panel-header h3{font-size:1rem;font-weight:600;margin:0;display:flex;align-items:center;gap:8px}.demo-panel-subtitle{font-size:.78rem;color:#475569}.demo-table-container{flex:1;overflow:auto;border-radius:6px;border:1px solid rgba(0,0,0,.05);background:#fff}.demo-table{width:100%;border-collapse:collapse;font-size:.8rem;text-align:left}.demo-table th{background:#f1f5f9;color:#475569;font-weight:600;padding:10px 12px;position:sticky;top:0;border-bottom:1px solid rgba(0,0,0,.08)}.demo-table td{padding:10px 12px;border-bottom:1px solid rgba(0,0,0,.04);color:#334155;white-space:nowrap}.demo-table tbody tr{cursor:pointer;transition:background .15s}.demo-table tbody tr:hover{background:#10b9810d}.demo-table tbody tr.selected{background:#10b9811a;border-left:3px solid var(--demo-accent)}.demo-right-panel{background:var(--demo-panel-bg);border:1px solid var(--demo-border);border-radius:12px;padding:20px;display:flex;flex-direction:column;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 20px #00000005}.demo-json-viewer{flex:1;background:#f8fafc;border:1px solid rgba(0,0,0,.05);border-radius:8px;padding:15px;font-family:Courier New,Courier,monospace;font-size:.75rem;color:#334155;overflow:auto;white-space:pre;line-height:1.4}.demo-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#64748b;gap:15px;text-align:center}.demo-empty-state svg{opacity:.6}.demo-log-panel{grid-column:1 / -1;background:#f1f5f9;border:1px solid rgba(0,0,0,.06);border-radius:8px;padding:12px 20px;display:flex;flex-direction:column;height:120px;overflow:hidden}.demo-log-header{font-size:.75rem;color:#475569;margin-bottom:6px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.demo-log-content{flex:1;overflow-y:auto;font-family:Courier New,Courier,monospace;font-size:.75rem;color:#0f2920;line-height:1.4}.demo-log-line{margin:3px 0}.demo-log-line.system{color:#0284c7;font-weight:600}.demo-log-line.success{color:#059669}.demo-log-line.warning{color:#d97706}.demo-launch-btn-container{margin-top:15px;display:flex;justify-content:flex-start}.launch-demo-btn{background:linear-gradient(135deg,#10b9811a,#0284c71a);border:1px solid var(--demo-accent);color:var(--demo-text-muted);padding:12px 24px;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s;box-shadow:0 2px 10px #10b9811a;font-size:.92rem;display:flex;align-items:center;gap:10px}.launch-demo-btn:hover{background:linear-gradient(135deg,#10b98140,#0284c740);box-shadow:0 4px 15px #10b98133;transform:translateY(-2px);border-color:var(--demo-accent-blue);color:#064e3b}.demo-table-container::-webkit-scrollbar,.demo-json-viewer::-webkit-scrollbar,.demo-log-content::-webkit-scrollbar{width:6px;height:6px}.demo-table-container::-webkit-scrollbar-track,.demo-json-viewer::-webkit-scrollbar-track,.demo-log-content::-webkit-scrollbar-track{background:transparent}.demo-table-container::-webkit-scrollbar-thumb,.demo-json-viewer::-webkit-scrollbar-thumb,.demo-log-content::-webkit-scrollbar-thumb{background:#0000001a;border-radius:3px}.demo-table-container::-webkit-scrollbar-thumb:hover,.demo-json-viewer::-webkit-scrollbar-thumb:hover,.demo-log-content::-webkit-scrollbar-thumb:hover{background:#10b98166}.ft-tab-btn{background:transparent;border:none;border-bottom:2px solid transparent;color:#64748b;padding:15px 20px;font-size:.88rem;font-weight:600;cursor:pointer;transition:all .2s;outline:none}.ft-tab-btn:hover{color:var(--demo-accent-orange)}.ft-tab-btn.active{color:var(--demo-accent-orange);border-bottom-color:var(--demo-accent-orange)}.ft-tab-view{display:none;height:100%}.ft-tab-view.active{display:block}.ft-chat-box::-webkit-scrollbar{width:5px}.ft-chat-box::-webkit-scrollbar-thumb{background:#0000000f;border-radius:3px}.ft-chat-box::-webkit-scrollbar-thumb:hover{background:#10b98133}
