:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#f5f7fb;color:#182230;line-height:1.4}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,select{font:inherit}button{cursor:pointer}.app-shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}.sidebar{background:#182230;color:#f8fafc;display:flex;flex-direction:column;gap:28px;padding:24px 18px}.brand,.identity{align-items:center;display:flex;gap:12px}.brand-mark{align-items:center;background:#22c55e;border-radius:8px;color:#052e16;display:grid;height:42px;place-items:center;width:42px}.brand strong,.identity strong{display:block;font-size:16px}.brand span,.identity span{color:#cbd5e1;display:block;font-size:12px}.nav-list{display:grid;gap:8px}.nav-list button,.identity{background:transparent;border:0;border-radius:8px;color:#dbeafe;display:flex;gap:10px;padding:11px 12px;text-align:left}.nav-list button.active,.nav-list button:hover{background:#263548;color:#fff}.nav-list svg{height:18px;width:18px}.identity{background:#263548;margin-top:auto}.workspace{min-width:0;padding:26px}.topbar,.detail-head,.panel-head,.top-actions,.detail-actions,.stream-controls{align-items:center;display:flex}.topbar{justify-content:space-between;margin-bottom:22px}.eyebrow{color:#64748b;font-size:12px;font-weight:700;letter-spacing:0;margin:0 0 4px;text-transform:uppercase}h1,h2,h3{margin:0}h1{font-size:clamp(26px,3vw,38px)}h2{font-size:24px}h3{font-size:15px}.top-actions{gap:10px}.icon-button,.panel-head button,.join-code button{align-items:center;background:#fff;border:1px solid #d8e0ec;border-radius:8px;color:#1e293b;display:grid;height:40px;place-items:center;width:40px}.primary-action,.create-strip button,.detail-actions button{align-items:center;background:#2563eb;border:0;border-radius:8px;color:#fff;display:flex;gap:8px;min-height:40px;padding:0 14px}.metric-grid{display:grid;gap:14px;grid-template-columns:repeat(4,minmax(150px,1fr));margin-bottom:18px}.metric,.detail-panel,.stream-panel,.activity-panel,.side-panel{background:#fff;border:1px solid #dde5f0;border-radius:8px}.metric{display:grid;gap:8px;min-height:126px;padding:18px}.metric div{align-items:center;border-radius:8px;display:grid;height:38px;place-items:center;width:38px}.metric span{color:#64748b;font-size:13px}.metric strong{font-size:28px}.metric.green div{background:#dcfce7;color:#15803d}.metric.yellow div{background:#fef3c7;color:#b45309}.metric.blue div{background:#dbeafe;color:#1d4ed8}.metric.red div{background:#fee2e2;color:#b91c1c}.main-grid{align-items:start;display:grid;gap:18px;grid-template-columns:minmax(280px,.85fr) minmax(360px,1.2fr) minmax(280px,.9fr)}.session-column,.detail-column,.ops-column{display:grid;gap:14px;min-width:0}.create-strip{background:#fff;border:1px solid #dde5f0;border-radius:8px;display:grid;gap:8px;grid-template-columns:1fr 120px auto;padding:10px}.create-strip input,.create-strip select{border:1px solid #d8e0ec;border-radius:8px;min-height:40px;min-width:0;padding:0 10px}.segmented{background:#e9eef6;border-radius:8px;display:grid;gap:4px;grid-template-columns:repeat(4,1fr);padding:4px}.segmented button{background:transparent;border:0;border-radius:6px;color:#475569;min-height:34px;text-transform:capitalize}.segmented button.active{background:#fff;color:#172033;box-shadow:0 1px 4px #0f172a1a}.session-list{display:grid;gap:10px}.session-row{align-items:center;background:#fff;border:1px solid #dde5f0;border-radius:8px;color:#172033;display:flex;justify-content:space-between;min-height:78px;padding:14px;text-align:left;width:100%}.session-row.active{border-color:#2563eb;box-shadow:0 0 0 3px #dbeafe}.session-row strong,.session-row span{display:block}.session-row span,.compact-list span{color:#64748b;font-size:12px}.status{border-radius:999px;display:inline-block;font-size:11px;font-weight:700;padding:5px 8px;text-transform:capitalize;white-space:nowrap}.status.waiting{background:#fef3c7;color:#92400e}.status.host_connected,.status.guest_connected{background:#dcfce7;color:#166534}.status.closed{background:#e2e8f0;color:#475569}.detail-panel,.stream-panel,.activity-panel,.side-panel{padding:16px}.detail-head,.panel-head{justify-content:space-between}.join-code{align-items:center;background:#eef6ff;border:1px dashed #93c5fd;border-radius:8px;display:flex;justify-content:space-between;margin:18px 0;padding:12px}.join-code span{color:#1d4ed8;font-size:32px;font-weight:800;letter-spacing:0}.detail-actions{gap:8px;flex-wrap:wrap}.detail-actions button:nth-child(2){background:#16a34a}.detail-actions button:nth-child(3){background:#475569}.stream-surface{align-items:center;aspect-ratio:16 / 9;background:linear-gradient(135deg,#2563ebd9,#082f49eb),repeating-linear-gradient(90deg,#334155 0 1px,transparent 1px 28px);border-radius:8px;color:#fff;display:grid;justify-items:center;overflow:hidden;padding:28px;position:relative;text-align:center}.scan-line{animation:scan 4s linear infinite;background:#ffffff38;height:2px;left:0;position:absolute;right:0;top:0}.stream-surface strong{font-size:22px;text-transform:capitalize}.stream-surface span{color:#dbeafe}.stream-controls{gap:16px;margin-top:12px}.stream-controls label{align-items:center;color:#475569;display:flex;gap:6px;font-size:13px}.event-list,.compact-list,.property-list{display:grid;gap:9px;margin-top:12px}.event-item,.property-row,.compact-list>div{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:10px}.event-item{align-items:center;display:grid;gap:8px;grid-template-columns:42px 1fr auto}.event-item span{background:#e0f2fe;border-radius:6px;color:#0369a1;font-size:12px;font-weight:800;padding:4px 6px;text-align:center}.event-item time{color:#64748b;font-size:12px}.property-row{align-items:center;display:flex;justify-content:space-between}.property-row span{color:#475569;font-size:13px}.compact-list strong{display:block;font-size:13px;text-transform:capitalize}.toast{animation:toast 2.4s ease forwards;background:#172033;border-radius:8px;bottom:24px;color:#fff;left:50%;padding:12px 16px;position:fixed;transform:translate(-50%)}.loading{align-items:center;display:flex;gap:10px;min-height:100vh;justify-content:center}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes scan{0%{transform:translateY(0)}to{transform:translateY(1000%)}}@keyframes toast{0%{opacity:0;transform:translate(-50%,12px)}12%,82%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,12px)}}@media(max-width:1180px){.main-grid{grid-template-columns:1fr 1fr}.ops-column{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:900px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.workspace{padding:18px}.topbar{align-items:flex-start;gap:16px;flex-direction:column}.metric-grid,.main-grid,.ops-column{grid-template-columns:1fr}}@media(max-width:560px){.create-strip{grid-template-columns:1fr}.top-actions{flex-wrap:wrap}.join-code span{font-size:25px}.event-item{grid-template-columns:38px 1fr}.event-item time{grid-column:2}}