.sdb-section{padding:0 0 48px}.sdb-stage{aspect-ratio:16/9;border:1px solid var(--ds-border);user-select:none;background:#fff;border-radius:8px;width:100%;display:flex;position:relative;overflow:hidden}.sdb-main{flex-direction:column;flex:1;width:100%;display:flex;position:relative;overflow:hidden}.sdb-chat{flex-direction:column;flex:1;gap:10px;padding:16px 20px;display:flex;overflow:hidden}.sdb-chat-msg{max-width:80%;font-family:var(--ds-font-sans);opacity:0;border-radius:8px;padding:8px 12px;font-size:11px;line-height:1.5;transition:opacity .35s,transform .35s;transform:translateY(8px)}.sdb-chat-msg.vis{opacity:1;transform:translateY(0)}.sdb-chat-msg.user{color:#f5f5f5;background:#0f0e12;align-self:flex-end}.sdb-chat-msg.bot{color:#333;background:#f2f2f2;align-self:flex-start}.sdb-chat-msg .sdb-typing{align-items:center;gap:3px;height:14px;display:inline-flex}.sdb-chat-msg .sdb-typing span{background:#999;border-radius:50%;width:4px;height:4px;animation:1.2s infinite sdbTyping}.sdb-chat-msg .sdb-typing span:nth-child(2){animation-delay:.2s}.sdb-chat-msg .sdb-typing span:nth-child(3){animation-delay:.4s}@keyframes sdbTyping{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}.sdb-dashboard{opacity:0;z-index:2;background:#fff;flex-direction:column;transition:opacity .4s,transform .4s ease-out;display:flex;position:absolute;inset:0;transform:translateY(100%)}.sdb-dashboard.vis{opacity:1;transform:translateY(0)}.sdb-metrics-row{gap:12px;padding:16px;display:flex}.sdb-metric{opacity:0;background:#fff;border:1px solid #eee;border-radius:6px;flex-direction:column;flex:1;padding:12px 16px;transition:opacity .35s,transform .35s;display:flex;transform:translateY(8px)}.sdb-metric.vis{opacity:1;transform:translateY(0)}.sdb-metric-label{font-family:var(--ds-font-mono);text-transform:uppercase;letter-spacing:.06em;color:#999;margin-bottom:4px;font-size:8px}.sdb-metric-value{font-family:var(--ds-font-sans);color:#0f0e12;font-size:20px;font-weight:300;line-height:1.2}.sdb-metric-delta{font-family:var(--ds-font-mono);margin-top:4px;font-size:9px}.sdb-metric.up .sdb-metric-delta{color:#4caf50}.sdb-metric.down .sdb-metric-delta{color:#e53935}.sdb-metric.neutral .sdb-metric-delta{color:#999}.sdb-table{flex:1;width:100%;padding:0 16px;overflow:hidden}.sdb-table-header{font-family:var(--ds-font-mono);text-transform:uppercase;letter-spacing:.06em;color:#999;border-bottom:1px solid #eee;padding:6px 0;font-size:8px;display:flex}.sdb-table-header .sdb-hcell{flex:1}.sdb-table-header .sdb-hcell:first-child{flex:1.5}.sdb-row{opacity:0;border-bottom:1px solid #f5f5f5;align-items:center;padding:6px 0;font-size:11px;transition:opacity .35s,transform .35s;display:flex;transform:translateY(8px)}.sdb-row.vis{opacity:1;transform:translateY(0)}.sdb-row-cell{font-family:var(--ds-font-mono);color:#0f0e12;opacity:0;flex:1;font-size:10px;transition:opacity .25s}.sdb-row-cell.vis{opacity:1}.sdb-row-cell:first-child{font-family:var(--ds-font-sans);color:#333;flex:1.5}.sdb-row-cell.name-cell{opacity:1}.sdb-dot{opacity:0;border-radius:50%;width:6px;height:6px;transition:opacity .3s;display:inline-block}.sdb-dot.vis{opacity:1}.sdb-dot.green{background:#4caf50}.sdb-dot.yellow{background:#f5a623}.sdb-dot.red{background:#e53935}.sdb-cursor{z-index:10;pointer-events:none;opacity:0;filter:drop-shadow(0 1px 3px #0003);transition:opacity .3s;position:absolute;top:50%;left:50%}.sdb-cursor.vis{opacity:1}.sdb-replay{z-index:12;font-family:var(--ds-font-mono);text-transform:uppercase;letter-spacing:.06em;color:#999;cursor:pointer;opacity:0;pointer-events:none;background:0 0;border:1px solid #ddd;border-radius:4px;align-items:center;gap:4px;padding:4px 10px;font-size:9px;transition:opacity .3s,color .15s,border-color .15s;display:flex;position:absolute;bottom:10px;right:12px}.sdb-replay.vis{opacity:1;pointer-events:auto}.sdb-replay:hover{color:#666;border-color:#bbb}@media (width<=600px){.sdb-stage{aspect-ratio:4/3}.sdb-chat-msg{font-size:9px}.sdb-metrics-row{gap:6px;padding:10px}.sdb-metric{padding:8px 10px}.sdb-metric-label{font-size:7px}.sdb-metric-value{font-size:14px}.sdb-metric-delta,.sdb-table-header{font-size:7px}.sdb-row-cell{font-size:8px}}
