@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap";
:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#f6f8fc;--muted:#a7b2c5;--soft:#68758b;--night:#05070c;--glass:#0a101ca8;--line:#edf3ff21;--sky:#72d7ff;--rose:#ff5e73;--green:#4ee2a3}*{box-sizing:border-box}html,body{min-height:100%;color:var(--ink);background:#07101b;margin:0;font-family:Manrope,sans-serif}body{background-image:radial-gradient(circle at 50% -20%,#163a57 0,#0000 32rem),linear-gradient(150deg,#0c1522,#05070c 58%)}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--sky);outline-offset:3px}.shell{place-items:center;min-height:100dvh;padding:20px;display:grid}.card{border:1px solid var(--line);background:linear-gradient(150deg,#1b293dd6,#080d17f0);border-radius:30px;width:min(100%,470px);padding:28px 22px 24px;box-shadow:0 30px 90px #00000073,inset 0 1px #ffffff12}.brand{align-items:center;gap:11px;margin-bottom:28px;display:flex}.logo{color:#031017;background:linear-gradient(135deg,#b7eeff,#57ccfb);border-radius:14px;place-items:center;width:40px;height:40px;font-family:DM Mono,monospace;font-weight:500;display:grid;box-shadow:0 8px 22px #56ccfb38}.brand strong{letter-spacing:-.02em;font-size:14px}h1{letter-spacing:-.07em;max-width:12ch;margin:0;font-size:clamp(33px,9vw,48px);line-height:1.04}p{color:var(--muted);font-size:14px;line-height:1.65}.actions{gap:13px;margin-top:26px;display:grid}.btn{border:1px solid var(--line);min-height:52px;color:var(--ink);background:#ffffff0e;border-radius:17px;padding:12px 16px;font-weight:700;transition:transform .18s,background .18s}.btn:hover:not(:disabled){background:#ffffff1c;transform:translateY(-1px)}.btn.primary{color:#031017;background:linear-gradient(110deg,#bdefff,#6bd2fb);border-color:#0000;box-shadow:0 12px 27px #4abbe933}.btn:disabled{opacity:.5;cursor:not-allowed}.inputRow{gap:9px;display:flex}.input{border:1px solid var(--line);min-width:0;color:var(--ink);letter-spacing:.08em;background:#01050c80;border-radius:17px;flex:1;padding:13px 15px;font-family:DM Mono,monospace}.note{color:var(--soft);font-size:12px}.error,.warning{border-radius:14px;margin:0 14px;padding:11px 13px;font-size:12px;line-height:1.45}.error{color:#ffdce1;background:#661122b8;border:1px solid #ff5e7366}.warning{color:#ffebb0;background:#573d0c9e;border:1px solid #ffc64f52}.callPage{isolation:isolate;background:#010306;flex-direction:column;min-height:100dvh;display:flex;position:relative;overflow:hidden}.callPage:before{content:"";z-index:-1;background:radial-gradient(circle at 15% 85%,#43bbdc21,#0000 32%),linear-gradient(#0c1724,#030508 68%);position:absolute;inset:0}.topbar{z-index:10;padding:max(15px, env(safe-area-inset-top)) 17px 10px;pointer-events:none;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;display:grid;position:absolute;inset:0 0 auto}.status{background:var(--glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#dbe5f4;white-space:nowrap;text-overflow:ellipsis;border:1px solid #ffffff1a;border-radius:99px;justify-self:start;align-items:center;gap:7px;min-width:0;max-width:130px;padding:7px 9px;font-size:10px;font-weight:700;display:inline-flex;overflow:hidden}.dot{background:#8390a3;border-radius:50%;flex:none;width:7px;height:7px}.dot.ok{background:var(--green);box-shadow:0 0 13px #4ee2a3bf}.topbar>div:last-child{pointer-events:auto;justify-self:end;gap:7px!important;display:flex!important}.roomCode{background:var(--glass);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#fff;letter-spacing:.1em;border:1px solid #ffffff1a;border-radius:99px;align-items:center;height:30px;padding:0 10px;font:500 11px DM Mono,monospace;display:inline-flex}.topbar .btn{background:#09101aab;border-radius:99px;min-height:30px;padding:4px 10px;font-size:10px}.stage{background:#0a101a;border:0;border-radius:0 0 28px 28px;order:-1;height:min(69dvh,720px);min-height:0;position:relative;overflow:hidden;box-shadow:0 18px 34px #00000040}.stage:after{content:"";z-index:1;pointer-events:none;background:linear-gradient(90deg,#0000,#ffffff47,#0000);height:2px;position:absolute;top:calc(50% - 1px);left:0;right:0;box-shadow:0 0 18px #ffffff24}.remoteVideo{object-fit:cover;background:#020407;width:100%;height:100%;position:absolute;inset:0}.remoteVideo:after{content:""}.screenSharePreview{z-index:3;object-fit:cover;background:#020407;width:100%;height:50%;display:none;position:absolute;inset:0 0 50%}.screenSharePreview.visible{display:block}.compositeSource{display:none}.remotePlaceholder{z-index:2;color:#c9d7e7;text-align:center;background:radial-gradient(circle at 50% 45%,#31637e6b,#0000 38%),linear-gradient(155deg,#1b3345,#0c111b);place-items:center;padding:75px 30px 35px;font-size:12px;line-height:1.65;display:grid;position:absolute;inset:0 0 50%}.remotePlaceholder strong{color:#fff;margin-bottom:3px;font-size:15px;display:inline-block}.localWrap{z-index:2;aspect-ratio:auto;width:100%;height:50%;box-shadow:none;background:#101b24;border:0;border-top:1px solid #ffffff21;border-radius:0;position:absolute;inset:auto 0 0}.localWrap:after{content:"";z-index:1;pointer-events:none;background:linear-gradient(#00000005 50%,#00000094);position:absolute;inset:0}.localVideo{z-index:0;object-fit:cover;width:100%;height:100%;display:block;position:relative;transform:scaleX(-1)}.localVideo.screen{object-fit:contain;background:#020407;transform:none}.recBadge{z-index:4;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);color:#fff;box-shadow:none;background:#370a16c7;border:1px solid #ff788b61;border-radius:99px;gap:7px;padding:7px 10px;font-size:10px;position:absolute;top:auto;bottom:calc(50% + 12px);left:16px}.recBadge time{font:500 11px DM Mono,monospace}.recordingLight{background:var(--soft);border:0;border-radius:99px;flex:none;width:8px;height:8px;display:inline-block}.recordingLight.live{background:var(--rose);animation:1.6s ease-in-out infinite recordingPulse;box-shadow:0 0 0 4px #ff5e7329,0 0 13px #ff5e73cc}.screenBadge{z-index:4;color:#e5faff;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#0b3b4ed1;border:1px solid #72d7ff59;border-radius:99px;padding:7px 10px;font-size:10px;font-weight:800;position:absolute;bottom:calc(50% + 12px);right:16px}@keyframes recordingPulse{50%{opacity:.55;transform:scale(.82)}}.recordingDock{z-index:4;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:#0b131fd1;border:1px solid #ffffff21;border-radius:22px;justify-content:space-between;align-items:center;gap:12px;margin:-17px 12px 0;padding:15px 14px;display:flex;position:relative;box-shadow:0 17px 32px #00000047}.recordingDock.isRecording{background:#290c18e0;border-color:#ff5e736b}.recordingState{align-items:center;gap:10px;min-width:0;display:flex}.recordingState>div{gap:2px;min-width:0;display:grid}.recordingState strong{letter-spacing:-.02em;font-size:12px}.recordingState span:last-child{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.recordingAction{align-items:center;gap:9px;display:flex}.recordingTimer{color:#fff;font-variant-numeric:tabular-nums;letter-spacing:-.04em;font:500 16px DM Mono,monospace}.recordPrimary{border:1px solid #0000;border-radius:12px;justify-content:center;align-items:center;gap:7px;min-width:0;min-height:38px;padding:9px 11px;font-size:11px;font-weight:800;display:inline-flex}.recordPrimary.start{color:#330810;background:#f78;box-shadow:0 6px 16px #ff5e7333}.recordPrimary.stop{color:#fff2f4;background:#9d2239;border-color:#d84b62}.recordPrimary:disabled{cursor:not-allowed;opacity:.48}.recordIcon{background:currentColor;border-radius:50%;width:9px;height:9px}.stopIcon{background:currentColor;border-radius:2px;width:9px;height:9px}.layoutPanel{background:0 0;border:0;border-radius:0;grid-template-columns:minmax(0,1fr) auto;align-self:stretch;align-items:center;gap:8px 10px;width:auto;margin:10px 14px 0;padding:0;display:grid}.layoutHeading{gap:2px;padding-left:2px;display:grid}.layoutHeading strong{font-size:11px}.layoutHeading span{color:var(--soft);font-size:9px}.layoutActions{align-items:center;gap:6px;display:flex}.layoutOptions{grid-column:1/-1;gap:6px;display:flex}.layoutOption{color:#d8e2ef;cursor:default;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;align-items:center;gap:6px;min-width:0;padding:6px 8px;display:flex}.layoutOption.selected{box-shadow:none;background:#3584a221;border-color:#72d7ff33}.layoutPreview{border-color:#ffffff40}.layoutPreview span{color:#e9f7ff;background:#77d2ff38}.layoutCopy strong{font-size:9px}.layoutCopy small{display:none}.qualityPanel{background:#ffffff09;border:1px solid #ffffff1a;border-radius:13px;grid-column:1/-1;grid-template-columns:auto 1fr;align-items:center;gap:7px 10px;padding:8px 9px;display:grid}.qualityPanel>span{color:var(--muted);font-size:9px;font-weight:800}.qualityPanel>div{grid-template-columns:1fr 1fr;gap:6px;display:grid}.qualityPanel button{color:#cbd6e4;background:#ffffff0d;border:1px solid #ffffff1f;border-radius:9px;min-height:31px;font-size:9px;font-weight:800}.qualityPanel button small{color:var(--soft);margin-left:2px;font-size:8px}.qualityPanel button.selected{color:#e8faff;background:#40a8cf33;border-color:#72d7ff80}.qualityPanel button.selected small{color:#bfeeff}.qualityPanel button:disabled{cursor:not-allowed;opacity:.62}.segmentNote{color:var(--soft);text-align:center;grid-column:1/-1;font-size:8px}.previewButton{color:#dff7ff;white-space:nowrap;background:#3a96b826;border:1px solid #72d7ff47;border-radius:10px;min-height:30px;padding:6px 9px;font-size:9px;font-weight:800}.previewButton:disabled{opacity:.45;cursor:not-allowed}.deviceButton{color:#dce6f3;background:#ffffff12;border:1px solid #ffffff29;border-radius:10px;min-height:30px;padding:6px 9px;font-size:9px;font-weight:800}.deviceButton:disabled{opacity:.45;cursor:not-allowed}.recordingPreview{z-index:30;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#00040ac2;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.previewCard{background:linear-gradient(145deg,#172435,#080d15);border:1px solid #ffffff29;border-radius:23px;gap:14px;width:min(100%,440px);padding:16px;display:grid;box-shadow:0 28px 70px #00000085}.previewHeader{justify-content:space-between;align-items:start;gap:12px;display:flex}.previewHeader>div{gap:3px;display:grid}.previewHeader strong{font-size:14px}.previewHeader span{color:var(--muted);font-size:11px}.previewClose{width:31px;height:31px;color:var(--ink);background:#ffffff0f;border:1px solid #ffffff21;border-radius:10px;flex:none;place-items:center;font-size:22px;line-height:1;display:grid}.previewCanvas{background:#050608;border:1px solid #ffffff1f;border-radius:14px;justify-self:center;width:100%;display:block;box-shadow:0 12px 26px #00000057}.previewCanvas.portrait-stack{aspect-ratio:9/16;width:min(100%,190px)}.previewCanvas.landscape-split{aspect-ratio:16/9}.previewLayouts{grid-template-columns:1fr 1fr;gap:8px;display:grid}.previewLayouts button{color:#cbd6e4;background:#ffffff0e;border:1px solid #ffffff1f;border-radius:11px;min-height:36px;font-size:10px;font-weight:800}.previewLayouts button.selected{color:#e8faff;background:#40a8cf33;border-color:#72d7ff80}.previewCard p{color:var(--soft);text-align:center;margin:-4px 1px 0;font-size:10px}.deviceCard{background:linear-gradient(145deg,#172435,#080d15);border:1px solid #ffffff29;border-radius:23px;gap:13px;width:min(100%,440px);padding:16px;display:grid;box-shadow:0 28px 70px #00000085}.deviceField{color:#e7eef8;gap:7px;font-size:11px;font-weight:800;display:grid}.deviceField select{appearance:auto;color:#edf6ff;background:#0b1320;border:1px solid #ffffff24;border-radius:12px;width:100%;min-height:43px;padding:0 11px;font:500 11px Manrope,sans-serif}.deviceField select:disabled{opacity:.5;cursor:not-allowed}.refreshDevices{color:#dff7ff;background:#3a96b826;border:1px solid #72d7ff47;border-radius:11px;min-height:37px;font-size:10px;font-weight:800}.refreshDevices:disabled{opacity:.5;cursor:not-allowed}.shareChoice{color:#dff7ff;text-align:left;background:#3a96b826;border:1px solid #72d7ff47;border-radius:13px;gap:3px;min-height:52px;padding:9px 12px;font-size:12px;font-weight:800;display:grid}.shareChoice small{color:var(--muted);font-size:10px;font-weight:500}.deviceHint{color:var(--soft);text-align:center;margin:-4px 0 0;font-size:10px}.controls{margin:auto 14px calc(14px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:#0c131ee6;border:1px solid #ffffff1f;border-radius:21px;grid-template-columns:repeat(4,1fr);gap:8px;padding:10px 11px;display:grid;box-shadow:0 17px 42px #0000004d}.control{color:#f7f9fc;background:#ffffff13;border:1px solid #ffffff21;border-radius:15px;min-height:49px;font-size:11px;font-weight:800;transition:transform .16s,background .16s}.control:active{transform:scale(.94)}.control.active{color:#ffe7eb;background:#7b1e34;border-color:#ff5e7373}.control.screenActive{color:#e6f9ff;background:#17556e;border-color:#72d7ff80}.control.end{color:#ffe7eb;background:#7b1e34;border-color:#ff5e7373}.control:disabled{cursor:not-allowed;opacity:.45}.footerInfo{display:none}@media (min-width:680px){body{place-items:center;padding:28px;display:grid}.callPage{border:1px solid #ffffff29;border-radius:42px;width:min(430px,100%);min-height:min(860px,100dvh - 56px);max-height:calc(100dvh - 56px);box-shadow:0 40px 120px #00000094,inset 0 0 0 8px #111722}.stage{height:min(64dvh,630px)}}@media (max-width:390px){.recordingDock{padding-inline:11px}.recordingTimer,.layoutHeading span{display:none}.layoutOption{padding-inline:6px}.controls{grid-template-columns:repeat(2,1fr)}}@media (prefers-reduced-motion:reduce){.recordingLight.live{animation:none}.btn,.control{transition:none}}