.host-picker { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:12px 0 0; scroll-margin-top:90px; }
.host-picker-title { font-size:13px; color:var(--text-secondary); }
.host-picker-tabs { display:flex; gap:3px; padding:3px; border:1px solid var(--border-subtle, #b9b3a8); border-radius:9px; }
.host-picker-tabs button { border:0; background:transparent; color:var(--text-secondary); padding:7px 20px; border-radius:6px; cursor:pointer; font-family:inherit; font-size:13px; font-weight:600; }
.host-picker-tabs button[aria-selected="true"] { background:var(--text-primary); color:var(--bg-canvas); }
.host-standalone { margin-left:auto; color:var(--text-secondary); font-size:12px; text-decoration:none; }
.host-panel { display:flex; flex-direction:column; gap:16px; min-width:0; }
.host-panel[hidden] { display:none !important; }
#orca-demo-frame { display:block; width:100%; height:900px; border:0; background:transparent; }
.demo-recordings { display:flex; flex-wrap:wrap; align-items:center; gap:8px 15px; font-size:12px; color:var(--text-secondary); padding:0 0 8px; }
.demo-recordings a { color:inherit; text-underline-offset:3px; }
.demo-recordings a[download] { opacity:.75; font-size:11px; }
@media(max-width:600px) { .host-picker { gap:8px; } .host-picker-title { flex-basis:100%; } .host-standalone { font-size:11px; } .demo-recordings span { flex-basis:100%; } }