:root {
  --live-violet: #8f72ff;
  --live-cyan: #58d8e8;
  --live-green: #62e6ad;
  --live-red: #ff667b;
  --live-border: #2b3a50;
  --live-panel: #0a111d;
  --live-raised: #101a29;
}

body.live-review-open { overflow: hidden; }
#super-live-review-root { position: relative; z-index: 2200; }
.live-review-overlay { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; padding: 26px; background: rgba(2, 5, 11, .86); backdrop-filter: blur(18px); }
#super-live-review-root[data-open="true"] .live-review-overlay { display: flex; }
.live-review-shell { position: relative; display: flex; flex-direction: column; width: min(1560px, calc(100vw - 52px)); height: min(940px, calc(100vh - 52px)); min-width: 0; min-height: 620px; overflow: hidden; color: #e7edf7; border: 1px solid #41516a; border-radius: 20px; background: linear-gradient(145deg, #0c1422 0%, #070c15 70%); box-shadow: 0 34px 100px rgba(0, 0, 0, .62), inset 0 1px rgba(255, 255, 255, .04); }
.live-review-shell button, .live-review-shell input, .live-review-shell select, .live-review-shell textarea { min-height: 38px; font: inherit; }
.live-review-shell button { border: 1px solid #334258; border-radius: 10px; color: #dce5f1; background: #111b29; cursor: pointer; }
.live-review-shell button:hover { border-color: #66799a; background: #172439; }
.live-review-shell button.primary { border-color: #8868fb; background: linear-gradient(180deg, #7355df, #5034ae); box-shadow: 0 8px 28px rgba(96, 63, 210, .25); }
.live-review-header { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 86px; padding: 15px 19px 15px 22px; border-bottom: 1px solid var(--live-border); background: rgba(14, 22, 36, .92); }
.live-review-header > div:first-child { min-width: 0; }
.live-review-header > div:first-child > span, .live-review-lobby > section > span, .live-review-lobby > form > span, .live-review-stage > header > div > span, .live-review-notes > header span, .live-review-capture-picker header span { color: #bca9ff; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.live-review-header h1 { margin: 4px 0 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: clamp(20px, 2vw, 28px); }
.live-review-header p { margin: 0; color: #8e9db0; font-size: 12px; }
.live-review-header > div:last-child { display: flex; align-items: center; gap: 10px; }
.live-review-header output { display: flex; align-items: center; gap: 7px; min-height: 35px; padding: 0 11px; border: 1px solid #2e4950; border-radius: 10px; color: #a9ebd0; background: #0a211d; font-size: 11px; font-weight: 700; }
.live-review-header output i, [data-live-network] > i { width: 8px; height: 8px; border-radius: 50%; background: var(--live-green); box-shadow: 0 0 14px rgba(98, 230, 173, .8); }
.live-review-header > div:last-child > button { width: 42px; min-height: 42px; padding: 0; font-size: 20px; }

.live-review-lobby-tabs { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 7px 18px; border-bottom: 1px solid var(--live-border); background: #0a111c; }
.live-review-lobby-tabs button { display: flex; align-items: center; gap: 9px; min-width: 156px; padding: 0 14px; font-size: 12px; font-weight: 800; }
.live-review-lobby-tabs button.active { border-color: #765de1; color: #ddd5ff; background: #251d4d; }
.live-review-lobby-tabs button i { display: grid; place-items: center; min-width: 23px; height: 23px; padding: 0 6px; border-radius: 12px; color: #aebcd0; background: #111d2c; font-size: 10px; font-style: normal; }

.live-review-lobby { flex: 1 1 auto; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(310px, .7fr); min-height: 0; }
.live-review-lobby > section { min-width: 0; padding: clamp(24px, 4vw, 62px); overflow: auto; }
.live-review-lobby > section h2 { max-width: 780px; margin: 10px 0; font-size: clamp(26px, 3vw, 44px); line-height: 1.08; }
.live-review-lobby > section > p { max-width: 760px; margin: 0 0 28px; color: #8e9db0; font-size: 14px; line-height: 1.6; }
.live-review-room-list { display: grid; gap: 10px; }
.live-review-room-card { display: grid !important; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; min-height: 76px !important; padding: 12px 15px !important; text-align: left; }
.live-review-room-card > i { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #5f4eb4; border-radius: 50%; color: #c3b5ff; background: #201a42; font-style: normal; }
.live-review-room-card b, .live-review-room-card small { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-review-room-card b { font-size: 14px; }
.live-review-room-card small { margin-top: 4px; color: #8796a9; font-size: 11px; }
.live-review-room-card em { color: #aa98f7; font-size: 12px; font-style: normal; }
.live-review-empty { min-height: 220px; display: grid; place-items: center; align-content: center; gap: 8px; padding: 28px; text-align: center; border: 1px dashed #35465e; border-radius: 16px; color: #8392a6; background: rgba(12, 20, 32, .54); }
.live-review-empty i { color: #8e75f0; font-size: 34px; font-style: normal; }
.live-review-empty b { color: #dce5f1; font-size: 15px; }
.live-review-lobby > form { display: flex; flex-direction: column; gap: 15px; min-width: 0; padding: clamp(24px, 4vw, 48px); border-left: 1px solid var(--live-border); background: #090f19; }
.live-review-lobby label { display: grid; gap: 7px; color: #98a7ba; font-size: 12px; font-weight: 700; }
.live-review-lobby input, .live-review-lobby select, .live-review-notes textarea { width: 100%; padding: 9px 11px; border: 1px solid #334157; border-radius: 10px; color: #e7edf7; background: #0c1420; }
.live-review-preflight { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.live-review-preflight button.active { border-color: #3e9a81; color: #a8f4d2; background: #0b2a24; }
.live-review-lobby > form > small, .live-review-lobby > form > p { color: #7e8da1; font-size: 11px; line-height: 1.5; }
.live-review-lobby > form > button.primary { margin-top: auto; min-height: 46px; }

.live-review-history { flex: 1 1 auto; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(340px, .72fr); min-height: 0; }
.live-review-history > section { min-width: 0; padding: clamp(22px, 3vw, 44px); overflow: auto; }
.live-review-history > section > span, .live-review-history-detail > header > span { color: #bca9ff; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.live-review-history > section h2 { margin: 8px 0; font-size: clamp(24px, 2.5vw, 36px); }
.live-review-history > section > p { max-width: 780px; margin: 0 0 22px; color: #8e9db0; font-size: 13px; line-height: 1.55; }
.live-review-room-card.previous.selected { border-color: #8066ec; background: #211b43; }
.live-review-history-detail { display: flex; flex-direction: column; gap: 16px; min-width: 0; padding: 28px; overflow: auto; border-left: 1px solid var(--live-border); background: #090f19; }
.live-review-history-detail > header h3 { margin: 7px 0 4px; font-size: 20px; }
.live-review-history-detail > header p, .live-review-history-detail > section p { margin: 0; color: #8c9caf; font-size: 11px; line-height: 1.5; }
.live-review-history-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.live-review-history-metrics span { padding: 12px; border: 1px solid #2d3c51; border-radius: 11px; background: #0d1724; }
.live-review-history-metrics b, .live-review-history-metrics small { display: block; }
.live-review-history-metrics b { font-size: 18px; }
.live-review-history-metrics small { margin-top: 3px; color: #7f90a5; font-size: 10px; }
.live-review-history-detail > section { padding: 13px; border: 1px solid #29394d; border-radius: 11px; background: #0b1420; }
.live-review-history-detail > section b { display: block; margin-bottom: 5px; font-size: 11px; }
.live-review-history-detail > footer { display: grid; gap: 9px; margin-top: auto; }
.live-review-history-detail > footer button { min-height: 44px; border-color: #735ddb; color: #ddd5ff; background: #251d4d; font-weight: 800; }
.live-review-history-detail > footer small { color: #718198; font-size: 10px; line-height: 1.45; }
.live-review-history-detail.empty { place-items: center; align-content: center; text-align: center; color: #7e8da1; }
.live-review-history-detail.empty i { color: #9078ef; font-size: 38px; font-style: normal; }
.live-review-history-detail.empty b { color: #dce5f1; font-size: 15px; }
.live-review-history-detail.empty span { max-width: 260px; font-size: 11px; line-height: 1.5; }

.live-review-session { flex: 1 1 auto; display: grid; grid-template-columns: minmax(0, 1fr) 340px; min-height: 0; padding-bottom: 78px; }
.live-review-stage { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-width: 0; min-height: 0; background: radial-gradient(circle at 50% 40%, #172438 0%, #070b12 72%); }
.live-review-stage:has(.live-review-media-warning) { grid-template-rows: auto auto minmax(0, 1fr) auto; }
.live-review-stage:has(.live-review-recording-notice) { grid-template-rows: auto auto minmax(0, 1fr) auto; }
.live-review-stage:has(.live-review-media-warning):has(.live-review-recording-notice) { grid-template-rows: auto auto auto minmax(0, 1fr) auto; }
.live-review-stage > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 18px; border-bottom: 1px solid #243248; }
.live-review-stage > header h2 { margin: 4px 0 0; font-size: 18px; }
[data-live-network] { display: flex; align-items: center; gap: 9px; padding: 7px 10px; border: 1px solid #293b4d; border-radius: 10px; background: rgba(6, 13, 21, .72); }
[data-live-network] span, [data-live-network] b, [data-live-network] small { display: block; }
[data-live-network] b { font-size: 11px; }
[data-live-network] small { margin-top: 2px; color: #79889c; font-size: 10px; }
.live-review-media-warning { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 11px; margin: 10px 12px 0; padding: 10px 11px; border: 1px solid #806632; border-radius: 11px; color: #f4dfac; background: #2b210f; }
.live-review-media-warning > i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; color: #231604; background: #f4be54; font-style: normal; font-weight: 900; }
.live-review-media-warning span, .live-review-media-warning b, .live-review-media-warning small { display: block; min-width: 0; }
.live-review-media-warning b { font-size: 12px; }
.live-review-media-warning small { margin-top: 3px; color: #baa982; font-size: 10px; line-height: 1.4; }
.live-review-media-warning > div { display: flex; gap: 7px; }
.live-review-media-warning button { min-height: 34px; padding: 0 10px; border-color: #8d723a; color: #ffe8b8; background: #3a2b11; font-size: 10px; font-weight: 800; }
.live-review-recording-notice { display: grid; grid-template-columns: 14px minmax(0, 1fr); align-items: center; gap: 10px; margin: 10px 12px 0; padding: 9px 11px; border: 1px solid #7b3d4d; border-radius: 11px; color: #ffd9df; background: #2b121a; }
.live-review-recording-notice > i { width: 10px; height: 10px; border-radius: 50%; background: #ff667b; box-shadow: 0 0 14px rgba(255, 102, 123, .8); }
.live-review-recording-notice span, .live-review-recording-notice b, .live-review-recording-notice small { display: block; }
.live-review-recording-notice b { font-size: 11px; }
.live-review-recording-notice small { margin-top: 2px; color: #c69aa2; font-size: 10px; }
.live-review-recording-notice.working { border-color: #7057d4; color: #e1d9ff; background: #211947; }
.live-review-recording-notice.working > i { background: #9c85ff; box-shadow: 0 0 14px rgba(156, 133, 255, .8); }
.live-review-participants { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); grid-auto-rows: minmax(210px, 1fr); gap: 10px; min-height: 0; padding: 12px; overflow: auto; }
.live-review-participants[data-count="1"] { grid-template-columns: minmax(0, 1fr); }
.live-review-participants[data-count="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.live-review-participants:is([data-count="3"],[data-count="4"]) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.live-review-participants:is([data-count="5"],[data-count="6"],[data-count="7"],[data-count="8"],[data-count="9"],[data-count="10"]) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.live-review-tile { position: relative; min-width: 0; min-height: 210px; overflow: hidden; border: 1px solid #324157; border-radius: 14px; background: #0b121d; }
.live-review-tile.local { border-color: #6250b6; }
.live-review-tile video { width: 100%; height: 100%; object-fit: cover; background: #05080d; }
.live-review-tile[data-video-orientation="portrait"] video { object-fit: contain; background: radial-gradient(circle at 50% 45%, #182338 0%, #05080d 72%); }
.live-review-tile .live-review-avatar { position: absolute; inset: 0; display: grid; place-items: center; color: #d6ccff; font-size: 32px; font-weight: 800; background: radial-gradient(circle, #2a2355 0%, #101827 56%, #070b12 100%); }
.live-review-tile.has-video .live-review-avatar { display: none; }
.live-review-tile footer { position: absolute; right: 9px; bottom: 9px; left: 9px; display: flex; align-items: center; justify-content: space-between; gap: 9px; padding: 8px 10px; border: 1px solid rgba(107, 125, 153, .35); border-radius: 10px; background: rgba(5, 10, 17, .8); backdrop-filter: blur(10px); }
.live-review-tile footer b, .live-review-tile footer small { display: block; }
.live-review-tile footer b { font-size: 11px; }
.live-review-tile footer small { margin-top: 2px; color: #8d9db0; font-size: 10px; }
.live-review-tile footer i { color: var(--live-green); font-style: normal; }
.live-review-waiting { grid-column: 1 / -1; display: grid; place-items: center; align-content: center; gap: 8px; text-align: center; color: #8494a8; }
.live-review-waiting i { color: #9c86f1; font-size: 34px; font-style: normal; }
.live-review-waiting b { color: #e0e7f1; font-size: 15px; }
.live-review-stage > footer { display: flex; align-items: center; gap: 16px; min-height: 38px; padding: 0 17px; border-top: 1px solid #253248; color: #8191a5; font-size: 10px; }
.live-review-notes { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-width: 0; min-height: 0; border-left: 1px solid var(--live-border); background: #090f19; }
.live-review-notes > header { display: flex; align-items: center; justify-content: space-between; min-height: 55px; padding: 0 14px; border-bottom: 1px solid #27354a; }
.live-review-notes > header b { color: #93a5bb; font-size: 11px; }
.live-review-notes > div { min-height: 0; padding: 10px; overflow: auto; }
.live-review-activity { display: grid !important; grid-template-columns: 20px minmax(0, 1fr); gap: 8px; width: 100%; min-height: 52px !important; margin-bottom: 7px; padding: 8px !important; text-align: left; }
.live-review-activity > i { color: #9d88f3; font-style: normal; }
.live-review-activity b, .live-review-activity small { display: block; }
.live-review-activity b { overflow: hidden; color: #ccd6e4; font-size: 11px; font-weight: 600; line-height: 1.35; }
.live-review-activity small { margin-top: 3px; color: #738399; font-size: 10px; }
.live-review-activity-empty { padding: 16px; color: #748499; font-size: 11px; line-height: 1.5; }
.live-review-notes > form { display: grid; gap: 9px; padding: 12px; border-top: 1px solid #27354a; }
.live-review-notes > form label { display: grid; gap: 6px; color: #9aabc0; font-size: 11px; font-weight: 700; }
.live-review-notes textarea { min-height: 82px; resize: vertical; }
.live-review-controls { position: absolute; right: 18px; bottom: 13px; left: 18px; display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 56px; padding: 7px 9px; border: 1px solid #3b4c63; border-radius: 16px; background: rgba(12, 20, 32, .94); box-shadow: 0 16px 42px rgba(0, 0, 0, .45); backdrop-filter: blur(16px); }
.live-review-controls button { display: grid; grid-template-columns: 20px auto; place-items: center; gap: 5px; min-width: 92px; min-height: 42px; padding: 0 10px; }
.live-review-controls button i { color: #a997f5; font-style: normal; }
.live-review-controls button span { font-size: 11px; font-weight: 700; }
.live-review-controls button.active { border-color: #3c907a; background: #0c2924; }
.live-review-controls button.sharing { border-color: #6753d1; background: #251d4b; box-shadow: 0 0 18px rgba(116, 82, 232, .25); }
.live-review-controls button.recording { border-color: #a34459; color: #ffd4dc; background: #3a1720; box-shadow: 0 0 18px rgba(255, 102, 123, .22); }
.live-review-controls button.muted, .live-review-controls button.danger { border-color: #69404c; background: #2b151c; }
.live-review-controls button.danger i { color: #ff8294; }
.live-review-controls button:disabled { cursor: progress; opacity: .72; }

.live-review-capture-picker { position: absolute; inset: 50% auto auto 50%; z-index: 4; width: min(940px, calc(100% - 44px)); max-height: calc(100% - 90px); overflow: hidden; transform: translate(-50%, -50%); border: 1px solid #4b5b74; border-radius: 16px; background: #0a111d; box-shadow: 0 28px 80px rgba(0, 0, 0, .7); }
.live-review-capture-picker > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 17px; border-bottom: 1px solid #2d3b50; }
.live-review-capture-picker h3 { margin: 3px 0 0; font-size: 17px; }
.live-review-capture-picker header button { width: 38px; padding: 0; }
.live-review-capture-picker > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; max-height: 620px; padding: 12px; overflow: auto; }
.live-review-capture-picker > div > button { min-width: 0; padding: 7px; text-align: left; }
.live-review-capture-picker figure { display: grid; place-items: center; aspect-ratio: 16 / 9; margin: 0 0 7px; overflow: hidden; border-radius: 7px; background: #05080e; }
.live-review-capture-picker figure img { width: 100%; height: 100%; object-fit: cover; }
.live-review-capture-picker figure i { font-size: 28px; font-style: normal; }
.live-review-capture-picker button > span { display: block; overflow: hidden; padding: 2px 3px; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }

.live-review-pip { position: fixed; z-index: 12; display: grid; grid-template-rows: 48px minmax(0, 1fr) 38px 48px; min-width: 300px; min-height: 176px; max-width: min(760px, calc(100vw - 16px)); max-height: min(620px, calc(100vh - 16px)); overflow: hidden; resize: both; color: #e9eff8; border: 1px solid #5e6e87; border-radius: 16px; background: #08101b; box-shadow: 0 20px 70px rgba(0, 0, 0, .72), 0 0 0 1px rgba(137, 108, 255, .12); }
.live-review-pip > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; padding: 7px 8px 7px 12px; border-bottom: 1px solid #2d3c51; background: linear-gradient(180deg, #121d2d, #0b1421); cursor: grab; touch-action: none; user-select: none; }
.live-review-pip > header:active { cursor: grabbing; }
.live-review-pip > header > div { display: flex; align-items: center; gap: 9px; min-width: 0; }
.live-review-pip > header > div > i { flex: 0 0 auto; width: 9px; height: 9px; border-radius: 50%; background: var(--live-green); box-shadow: 0 0 13px rgba(98, 230, 173, .8); }
.live-review-pip > header span, .live-review-pip > header b, .live-review-pip > header small { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-review-pip > header b { color: #baa8ff; font-size: 10px; letter-spacing: .13em; }
.live-review-pip > header small { margin-top: 2px; color: #d9e2ee; font-size: 11px; }
.live-review-pip > header nav { display: flex; gap: 5px; }
.live-review-pip button, .live-review-pip select { min-height: 30px; border: 1px solid #35455c; border-radius: 8px; color: #e3eaf4; background: #101b29; font: inherit; }
.live-review-pip button { cursor: pointer; }
.live-review-pip > header button { width: 31px; padding: 0; }
.live-review-pip-media { position: relative; min-height: 0; overflow: hidden; background: radial-gradient(circle at 50% 30%, #27204f 0%, #111a29 50%, #070b12 100%); }
.live-review-pip-media video { width: 100%; height: 100%; object-fit: cover; background: #05080d; }
.live-review-pip-avatar { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 5px; text-align: center; color: #8796aa; }
.live-review-pip-avatar i { display: grid; place-items: center; width: 54px; height: 54px; border: 1px solid #7761d8; border-radius: 50%; color: #d9d0ff; background: #2a2157; font-size: 22px; font-style: normal; font-weight: 800; }
.live-review-pip-avatar b { color: #e8eef7; font-size: 13px; }
.live-review-pip-avatar span { font-size: 10px; }
.live-review-pip.has-video .live-review-pip-avatar { display: none; }
.live-review-pip-media output { position: absolute; top: 9px; left: 9px; padding: 5px 7px; border: 1px solid rgba(118, 139, 166, .48); border-radius: 7px; color: #dfe8f4; background: rgba(7, 13, 21, .72); font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.live-review-pip.preview-mode .live-review-pip-media output { border-color: #846ce9; color: #c9bfff; }
.live-review-pip-audio { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 6px 10px; border-top: 1px solid #2a394e; border-bottom: 1px solid #2a394e; background: #0a131f; }
.live-review-pip-audio > div { position: relative; height: 9px; overflow: hidden; border: 1px solid #314558; border-radius: 5px; background: repeating-linear-gradient(90deg, #102119 0 5px, #09130f 5px 8px); }
.live-review-pip-audio > div::before { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--live-level, 2%); background: linear-gradient(90deg, #36c995, #8ee6b6 72%, #f0d76a); transition: width 70ms linear; }
.live-review-pip-audio > span { display: flex; align-items: baseline; gap: 7px; white-space: nowrap; }
.live-review-pip-audio b { font-size: 10px; }
.live-review-pip-audio small { color: #65e2b0; font-size: 10px; font-weight: 800; }
.live-review-pip > footer { display: grid; grid-template-columns: 38px 38px minmax(0, 1fr) 38px; align-items: center; gap: 6px; padding: 6px 8px; }
.live-review-pip > footer button { min-width: 0; padding: 0 8px; font-size: 12px; font-weight: 700; }
.live-review-pip > footer button.active { border-color: #348d75; color: #a4f2d1; background: #0c2c24; }
.live-review-pip > footer button.muted, .live-review-pip > footer button.danger { border-color: #6b3d4a; color: #ff9aaa; background: #2d151e; }
.live-review-pip.audio-mode { grid-template-rows: 48px minmax(64px, 1fr) 38px 48px; }
.live-review-pip.audio-mode .live-review-pip-media video { display: none; }
.live-review-pip.audio-mode .live-review-pip-avatar i { width: 44px; height: 44px; font-size: 18px; }
.live-review-pip-settings { position: absolute; top: 48px; right: 8px; z-index: 4; display: grid; gap: 10px; width: min(300px, calc(100% - 16px)); max-height: calc(100% - 58px); padding: 12px; overflow: auto; border: 1px solid #53657f; border-radius: 12px; background: rgba(8, 15, 25, .98); box-shadow: 0 18px 48px rgba(0, 0, 0, .65); }
.live-review-pip-settings > header { display: flex; align-items: center; justify-content: space-between; }
.live-review-pip-settings > header b { font-size: 12px; }
.live-review-pip-settings > header button { width: 30px; padding: 0; }
.live-review-pip-settings > label { display: grid; gap: 5px; color: #91a1b5; font-size: 10px; font-weight: 800; letter-spacing: .05em; }
.live-review-pip-settings select { width: 100%; padding: 0 8px; font-size: 11px; }
.live-review-pip-checks { display: grid; gap: 6px; }
.live-review-pip-checks label { display: flex; align-items: center; gap: 7px; color: #b7c3d2; font-size: 10px; }
.live-review-pip-checks input { accent-color: #8066ee; }
.live-review-pip-sizes { display: grid; grid-template-columns: minmax(0, 1fr) repeat(3, 34px); align-items: center; gap: 5px; color: #8999ad; font-size: 10px; }
.live-review-pip-sizes button { padding: 0; }
.live-review-pip-settings > p { display: flex; align-items: center; gap: 8px; margin: 0; padding: 8px; border: 1px solid #245244; border-radius: 9px; background: #0a211c; }
.live-review-pip-settings > p i { width: 8px; height: 8px; border-radius: 50%; background: var(--live-green); }
.live-review-pip-settings > p span, .live-review-pip-settings > p b, .live-review-pip-settings > p small { display: block; }
.live-review-pip-settings > p b { color: #c8f1df; font-size: 10px; }
.live-review-pip-settings > p small { margin-top: 2px; color: #77a391; font-size: 10px; }

@media (max-width: 1100px) {
  .live-review-overlay { padding: 12px; }
  .live-review-shell { width: calc(100vw - 24px); height: calc(100vh - 24px); }
  .live-review-session { grid-template-columns: minmax(0, 1fr) 290px; }
  .live-review-controls { justify-content: flex-start; overflow-x: auto; }
  .live-review-controls button { flex: 0 0 auto; }
}

@media (max-width: 820px) {
  .live-review-header p, .live-review-header output { display: none; }
  .live-review-lobby > form, .live-review-notes { border-left: 0; border-top: 1px solid var(--live-border); }
  .live-review-history-detail { min-height: 420px; border-left: 0; border-top: 1px solid var(--live-border); }
  .live-review-lobby > form { min-height: 420px; }
  .live-review-session { padding-bottom: 76px; }
  .live-review-stage { min-height: 520px; }
  .live-review-notes { min-height: 430px; }
  .live-review-capture-picker > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) and (orientation: portrait) {
  .live-review-shell { height: calc(100dvh - 24px); }
  .live-review-session { align-content: start; }
  .live-review-stage { min-height: min(64dvh, 640px); }
  .live-review-notes { min-height: 360px; }
  .live-review-participants:is([data-count="1"],[data-count="2"]) { grid-template-columns: 1fr; }
  .live-review-controls { right: 8px; bottom: max(8px, env(safe-area-inset-bottom)); left: 8px; justify-content: flex-start; scroll-snap-type: x proximity; }
  .live-review-controls button { scroll-snap-align: start; }
}

@media (max-height: 620px) and (orientation: landscape) {
  .live-review-overlay { padding: 0; }
  .live-review-shell { width: 100vw; height: 100dvh; min-height: 0; border: 0; border-radius: 0; }
  .live-review-header { min-height: 58px; padding: max(7px, env(safe-area-inset-top)) 12px 7px; }
  .live-review-header h1 { margin-top: 2px; font-size: 16px; }
  .live-review-session { grid-template-columns: minmax(0, 1fr) minmax(220px, 30vw); padding-bottom: 62px; overflow: hidden; }
  .live-review-stage, .live-review-notes { min-height: 0; }
  .live-review-stage > header { padding: 7px 12px; }
  .live-review-stage > header h2 { font-size: 14px; }
  .live-review-stage > footer { min-height: 28px; }
  .live-review-participants { grid-auto-rows: minmax(130px, 1fr); padding: 7px; }
  .live-review-tile { min-height: 130px; }
  .live-review-notes { border-top: 0; border-left: 1px solid var(--live-border); }
  .live-review-notes > header { min-height: 42px; }
  .live-review-notes textarea { min-height: 58px; }
  .live-review-controls { right: max(8px, env(safe-area-inset-right)); bottom: max(6px, env(safe-area-inset-bottom)); left: max(8px, env(safe-area-inset-left)); min-height: 48px; padding: 4px 7px; justify-content: flex-start; overflow-x: auto; }
  .live-review-controls button { flex: 0 0 auto; min-height: 38px; }
}

@media (max-width: 560px) {
  .live-review-overlay { padding: 0; }
  .live-review-shell { width: 100vw; height: 100dvh; min-height: 0; border: 0; border-radius: 0; }
  .live-review-header { min-height: 72px; padding: max(11px, env(safe-area-inset-top)) 12px 11px; }
  .live-review-header h1 { font-size: 18px; }
  .live-review-lobby > section, .live-review-lobby > form { padding: 20px 14px; }
  .live-review-participants[data-count] { grid-template-columns: 1fr; grid-auto-rows: minmax(220px, 42vh); }
  .live-review-capture-picker > div { grid-template-columns: 1fr; }
  .live-review-pip { right: 8px !important; bottom: 8px !important; left: auto !important; width: calc(100vw - 16px) !important; max-width: none; }
}

@media (prefers-reduced-motion: reduce) {
  .live-review-shell *, .live-review-overlay { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
