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