*{margin:0;padding:0;box-sizing:border-box;font-family:system-ui,-apple-system,sans-serif}.center-screen{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#0b0b0b;color:#fff;padding:24px;text-align:center}.spinner{width:32px;height:32px;border:3px solid rgba(255,255,255,.2);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.spinner.small{width:16px;height:16px;border-width:2px}@keyframes spin{to{transform:rotate(360deg)}}.call-container{position:relative;height:100%;background:#000;display:flex;flex-direction:column}.call-header{position:absolute;top:0;left:0;right:0;z-index:10;padding:14px 20px;color:#fff;font-weight:500;text-shadow:0 0 4px rgba(0,0,0,.6);padding-top:max(14px,env(safe-area-inset-top))}.voice-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#ccc;gap:20px}.voice-avatar{width:120px;height:120px;border-radius:60px;background:#222;display:flex;align-items:center;justify-content:center;font-size:48px}.remote-container{flex:1;position:relative;overflow:hidden}.remote-video{width:100%;height:100%}.remote-video.cover{object-fit:cover}.remote-video.contain{object-fit:contain;background:#111}.waiting-box{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#ffffffb3;font-size:14px;padding:0 24px;text-align:center}.self-view{position:absolute;top:max(56px,calc(env(safe-area-inset-top) + 48px));right:16px;width:100px;height:140px;border-radius:12px;overflow:hidden;border:2px solid rgba(255,255,255,.3)}.self-video{width:100%;height:100%;object-fit:cover}.remote-cam-tile{position:absolute;top:max(200px,calc(env(safe-area-inset-top) + 192px));right:16px;width:100px;height:140px;border-radius:12px;overflow:hidden;border:2px solid rgba(255,255,255,.3)}.controls{display:flex;align-items:center;justify-content:center;gap:20px;padding:24px 12px;padding-bottom:max(24px,env(safe-area-inset-bottom))}.ctrl-btn{width:56px;height:56px;border-radius:28px;border:none;background:#ffffff26;font-size:22px;cursor:pointer}.ctrl-btn.off{background:#ffffff59}.ctrl-btn.active{background:#4a7fe8}.leave-btn{width:64px;height:64px;border-radius:32px;border:none;background:#e24b4a;font-size:26px;cursor:pointer;transform:rotate(135deg)}.sharing-banner{position:absolute;top:max(56px,calc(env(safe-area-inset-top) + 48px));left:50%;transform:translate(-50%);background:#000000a6;color:#fff;padding:8px 16px;border-radius:999px;font-size:13px}.connecting-banner{position:absolute;top:max(56px,calc(env(safe-area-inset-top) + 48px));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;background:#0009;color:#fff;padding:8px 16px;border-radius:999px;font-size:13px}.wb-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#fff;display:flex;flex-direction:column}.wb-header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:1px solid #eee;font-weight:600;padding-top:max(12px,env(safe-area-inset-top))}.wb-close{border:none;background:none;font-size:20px;color:#999;cursor:pointer}.wb-pagebar{display:flex;gap:8px;padding:8px 12px;border-bottom:1px solid #eee;overflow-x:auto}.wb-pagedot{width:28px;height:28px;border-radius:14px;background:#eee;display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0}.wb-pagedot.active{background:#4a7fe8;color:#fff}.wb-permbar{padding:8px 12px}.wb-raisehand{background:#e8effe;color:#4a7fe8;border:none;padding:8px 16px;border-radius:999px;font-weight:600;font-size:13px}.wb-denied{position:fixed;bottom:110px;left:50%;transform:translate(-50%);background:#000000bf;color:#fff;padding:8px 16px;border-radius:999px;font-size:12px;z-index:60}.wb-canvaswrap{flex:1;position:relative;background:#fff}.wb-center{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:#999;padding:24px;text-align:center}.wb-toolbar{border-top:1px solid #eee;padding:8px 0;background:#fafafa}.wb-tools{display:flex;gap:6px;padding:0 12px;overflow-x:auto}.wb-tool{width:44px;height:44px;border-radius:10px;border:none;background:transparent;font-size:18px;cursor:pointer;flex-shrink:0}.wb-tool.active{background:#e8effe}.wb-controls{display:flex;align-items:center;gap:12px;padding:8px 16px;flex-wrap:wrap}.wb-colors{display:flex;gap:8px}.wb-swatch{width:24px;height:24px;border-radius:12px;border:2px solid transparent;cursor:pointer}.wb-swatch.active{border-color:#1a1a1a}.wb-widths{display:flex;gap:8px}.wb-width{width:32px;height:32px;border-radius:16px;border:none;background:#eee;display:flex;align-items:center;justify-content:center;cursor:pointer}.wb-width.active{background:#e8effe}.wb-fill{border:none;background:#eee;padding:6px 12px;border-radius:999px;font-size:12px;cursor:pointer}.wb-fill.active{background:#4a7fe8;color:#fff}.wb-disabled{text-align:center;padding:16px;color:#999;font-size:13px;border-top:1px solid #eee;background:#fafafa}.wb-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;padding:24px;z-index:70}.wb-modal{background:#fff;border-radius:16px;padding:20px;width:100%;max-width:360px}.wb-modal h4{margin-bottom:12px}.wb-modal textarea{width:100%;min-height:60px;border:1px solid #ddd;border-radius:8px;padding:10px;font-size:14px;resize:vertical}.wb-modal-row{display:flex;gap:12px;margin-top:16px}.wb-modal-cancel,.wb-modal-confirm{flex:1;border:none;padding:12px;border-radius:8px;font-weight:600;cursor:pointer}.wb-modal-cancel{background:#eee;color:#555}.wb-modal-confirm{background:#4a7fe8;color:#fff}.wb-video-row{display:flex;gap:8px;padding:8px 12px;border-bottom:1px solid #eee}.wb-video-tile{position:relative;width:90px;height:70px;border-radius:10px;overflow:hidden;background:#000}.wb-video-tile video{width:100%;height:100%;object-fit:cover}.wb-video-label{position:absolute;bottom:2px;left:4px;color:#fff;font-size:10px;text-shadow:0 0 3px rgba(0,0,0,.8)}