.dt-shell{border:1px solid var(--border);border-radius:28px;background:linear-gradient(155deg,rgba(14,27,36,.97),rgba(5,10,15,.98));box-shadow:var(--shadow);overflow:hidden}.dt-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding:24px 24px 12px}.dt-head h2{margin:0}.dt-head .lead{max-width:820px;color:#c8dce7;margin:.35rem 0}.dt-badges{display:flex;gap:8px;flex-wrap:wrap}.dt-badge{border:1px solid var(--border);border-radius:999px;padding:6px 10px;color:var(--muted);font-size:.78rem}.dt-badge strong{color:var(--ink)}.dt-events{display:flex;gap:8px;padding:8px 24px 18px;overflow:auto}.dt-event{appearance:none;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.055);color:var(--ink);padding:9px 12px;cursor:pointer;white-space:nowrap;font-weight:800}.dt-event:hover,.dt-event.active{border-color:var(--cyan);background:rgba(102,228,255,.14);color:var(--cyan)}.dt-workspace{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr);gap:14px;padding:0 24px 24px;align-items:start}.dt-card{border:1px solid var(--border);border-radius:20px;background:rgba(255,255,255,.035);padding:14px;min-width:0}.dt-card h3{margin:.1rem 0 .7rem}.dt-video{width:100%;aspect-ratio:16/9;background:#000;border-radius:14px;display:block}.dt-controls{display:grid;grid-template-columns:auto minmax(120px,1fr) auto;gap:10px;align-items:center;margin-top:10px}.dt-controls input[type=range]{width:100%;accent-color:var(--cyan)}.dt-select{background:#0b1820;color:var(--ink);border:1px solid var(--border);border-radius:10px;padding:8px;max-width:100%}.dt-time{font:700 .8rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--cyan);white-space:nowrap}.dt-view-grid{display:grid;grid-template-columns:1fr;gap:14px}.dt-canvas{display:block;width:100%;aspect-ratio:16/10;border-radius:14px;background:#061019;touch-action:none}.dt-canvas.interactive{cursor:grab}.dt-canvas.interactive:active{cursor:grabbing}.dt-layerbar{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}.dt-toggle{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:999px;padding:6px 9px;color:var(--muted);font-size:.78rem}.dt-toggle input{accent-color:var(--cyan)}.dt-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}.dt-stat{padding:10px;border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.035)}.dt-stat b{display:block;font-size:1.05rem}.dt-stat small{color:var(--muted)}.dt-frame-meta{margin-top:10px;padding:10px;border-left:3px solid var(--cyan);background:rgba(102,228,255,.06);font:500 .78rem/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;min-height:58px}.dt-legend{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:0 24px 24px}.dt-truth{border:1px solid var(--border);border-radius:14px;padding:10px;font-size:.8rem;color:var(--muted)}.dt-truth b{display:block;margin-bottom:3px}.dt-truth.observed b{color:var(--green)}.dt-truth.detected b{color:var(--cyan)}.dt-truth.inferred b{color:var(--amber)}.dt-truth.unknown b{color:var(--red)}.dt-error{padding:20px;color:var(--red)}.dt-help{font-size:.76rem;color:var(--muted);margin:.45rem 0 0}.dt-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.dt-actions a{font-size:.82rem}.dt-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:980px){.dt-workspace{grid-template-columns:1fr}.dt-view-grid{grid-template-columns:1fr 1fr}}@media(max-width:680px){.dt-head{display:block}.dt-workspace{padding:0 12px 14px}.dt-events{padding-left:12px}.dt-view-grid{grid-template-columns:1fr}.dt-legend{grid-template-columns:1fr 1fr;padding:0 12px 14px}.dt-stats{grid-template-columns:1fr 1fr}.dt-controls{grid-template-columns:1fr}.dt-time{text-align:right}}