*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#101828;color:#f2f4f7}.screen{min-height:100%;display:flex;align-items:center;justify-content:center;padding:16px}.card{width:100%;max-width:420px;background:#1d2939;border-radius:16px;padding:24px;text-align:center;display:flex;flex-direction:column;gap:12px}.card h1{font-size:22px}.card p{color:#d0d5dd;line-height:1.5}.muted{color:#98a2b3}.datetime{font-weight:600}.button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:10px;background:#1a73e8;color:#fff;font-size:16px;font-weight:600;padding:14px 24px;cursor:pointer}.button:disabled{opacity:.5;cursor:default}.button.join{margin-top:8px}.preview{position:relative;aspect-ratio:4 / 3;background:#0c111d;border-radius:12px;overflow:hidden;display:flex;align-items:center;justify-content:center}.preview video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.preview video.hidden,.local-preview video.hidden{display:none}.preview-controls{position:absolute;bottom:12px;left:0;right:0;display:flex;justify-content:center;gap:12px}.round-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;width:52px;height:52px;border-radius:50%;background:#ffffff24;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}.round-button.off,.round-button.hangup{background:#f04438}.select-label{display:flex;flex-direction:column;gap:4px;text-align:left;font-size:13px;color:#98a2b3}.select-label select{border-radius:8px;border:1px solid #344054;background:#0c111d;color:#f2f4f7;padding:10px;font-size:15px}.media-blocked{display:flex;flex-direction:column;gap:12px;padding:12px 0}.media-blocked h2{font-size:17px}.spinner{width:36px;height:36px;border:3px solid rgba(255,255,255,.2);border-top-color:#1a73e8;border-radius:50%;animation:spin .9s linear infinite;margin:0 auto}@keyframes spin{to{transform:rotate(360deg)}}.call{position:fixed;top:0;right:0;bottom:0;left:0;background:#0c111d}.remote-video{width:100%;height:100%;object-fit:cover}.call-status{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#0c111dd9;font-size:17px}.local-preview{position:absolute;top:calc(env(safe-area-inset-top,0px) + 12px);right:12px;width:108px;aspect-ratio:3 / 4;background:#1d2939;border-radius:12px;overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px #0006}.local-preview video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.call-settings{position:absolute;bottom:calc(env(safe-area-inset-bottom,0px) + 96px);left:50%;transform:translate(-50%);width:min(320px,calc(100% - 32px));background:#1d2939;border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px}.call-controls{position:absolute;bottom:calc(env(safe-area-inset-bottom,0px) + 24px);left:0;right:0;display:flex;justify-content:center;gap:16px}