.chat-input-area{display:flex;padding:var(--spacing-md);border-top:1px solid var(--color-border-dark);background-color:var(--color-bg-input-area);box-sizing:border-box}.chat-input{flex:1;min-width:0;padding:var(--spacing-sm);border:1px solid var(--color-border-dark);border-radius:var(--radius-sm);margin-right:var(--spacing-sm);background-color:var(--color-bg-input);color:var(--color-text-main);box-sizing:border-box;transition:border-color .2s ease-in-out}.chat-input:focus{outline:none;border-color:var(--color-border-hover)}.chat-send-btn{padding:var(--spacing-sm) 12px;cursor:pointer;border:none;border-radius:var(--radius-sm);background-color:var(--color-primary);color:var(--color-text-inverted);white-space:nowrap;transition:filter .2s ease-in-out}.chat-send-btn:hover{filter:brightness(90%)}.message{padding:6px var(--spacing-md);border-radius:var(--radius-lg);max-width:85%;word-wrap:break-word;font-size:var(--font-size-md);font-weight:500}.message.self{align-self:flex-end;color:var(--color-text-main)}.message.remote{align-self:flex-start;color:var(--color-text-main)}.message-file-link{display:block;margin-top:5px;color:inherit;text-decoration:underline;cursor:pointer}.message-file-link.error{color:var(--color-error);cursor:default;text-decoration:none}.message-progress-container{height:4px;background-color:#0003;border-radius:2px;margin-top:4px;overflow:hidden}.message-progress-bar{height:100%;width:0%;background-color:var(--color-text-main);transition:width .1s linear}.message-error-text{color:var(--color-error);font-size:var(--font-size-sm);margin-top:2px;cursor:pointer}#media-starter{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--color-bg-overlay);display:flex;justify-content:center;align-items:center;z-index:var(--z-index-overlay);color:var(--color-text-main)}.media-starter-content{text-align:center}#allow-media-btn{padding:15px var(--spacing-xl);font-size:1.2em;cursor:pointer;border:2px solid var(--color-border-light);background-color:transparent;color:var(--color-text-main);border-radius:var(--radius-md);transition:background-color .2s,color .2s}#view3d-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;outline:none;background-color:var(--color-bg-panel)}#view3d-model-progress-indicator{position:absolute;bottom:var(--spacing-md);left:var(--spacing-md);background:var(--color-bg-overlay);color:var(--color-text-inverted);padding:var(--spacing-xs) var(--spacing-md);border-radius:var(--radius-sm);font-family:sans-serif;font-size:var(--font-size-md);z-index:10;display:none;pointer-events:none}#view3d-lock-icon{position:absolute;top:10px;left:10px;font-size:24px;z-index:10;display:none;pointer-events:none;filter:drop-shadow(0 0 2px rgba(0,0,0,.5))}#canvas{position:absolute;top:0;left:0;width:100%;height:100%;cursor:crosshair;z-index:10}.marker{position:absolute;width:24px;height:24px;border-radius:50%;background-color:#ff000080;pointer-events:none;z-index:20}#hint{position:absolute;bottom:10px;left:50%;transform:translate(-50%);background:var(--color-bg-overlay);color:var(--color-text-inverted);padding:6px 12px;border-radius:var(--radius-sm);font-size:var(--font-size-md);pointer-events:none;z-index:30}.users-list-container{display:flex;align-items:center;gap:var(--spacing-sm);padding:0 var(--spacing-md)}.user-circle{width:24px;height:24px;border-radius:50%;border:1px solid rgba(0,0,0,.2);box-sizing:border-box;transition:transform .2s ease;box-shadow:0 1px 2px #0000001a}.videos-container{position:absolute;bottom:var(--spacing-lg);left:var(--spacing-lg);display:flex;flex-wrap:wrap;gap:var(--spacing-md);z-index:var(--z-index-video);max-width:calc(100% - 40px)}.video-wrapper{width:160px;height:120px;position:relative;background-color:var(--color-bg-dark);border-radius:var(--radius-md);overflow:hidden;transition:all .2s ease-in-out;box-shadow:0 1px 3px #0000001a}.video-wrapper:hover{transform:scale(1.05);box-shadow:0 4px 8px #00000026}.video-border-overlay{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;border:3px solid var(--color-border-dark);box-sizing:border-box;pointer-events:none}.video-wrapper video{width:100%;height:100%;object-fit:cover}.video-wrapper.local video{transform:scaleX(-1)}.videos-container.expanded-mode{top:0;left:0;width:100%;height:100%;background-color:var(--color-bg-darker);max-width:none;padding:var(--spacing-lg);box-sizing:border-box;align-items:flex-end}.videos-container.expanded-mode .video-wrapper:not(.expanded){z-index:2}.videos-container.expanded-mode .video-wrapper.expanded{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:0;z-index:1}.videos-container.expanded-mode .video-wrapper.expanded .video-border-overlay{border-width:2px}#chat-container{width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box}.chat-messages{flex:1;overflow-y:auto;padding:var(--spacing-md);display:flex;flex-direction:column;gap:var(--spacing-sm);min-height:0}.whiteboard-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--color-bg-panel);z-index:1000;display:flex;flex-direction:column}.whiteboard-toolbar{position:absolute;top:var(--spacing-md);left:50%;transform:translate(-50%);height:auto;background-color:var(--color-bg-panel);border:1px solid var(--color-border-dark);border-radius:var(--radius-md);box-shadow:0 4px 6px #0000001a;display:flex;align-items:center;padding:var(--spacing-xs) var(--spacing-md);gap:var(--spacing-sm);z-index:10}.wb-tool-btn{width:40px;height:40px;border:1px solid transparent;background:transparent;color:var(--color-text-main);border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.wb-tool-btn:hover{background-color:var(--color-bg-hover)}.wb-tool-btn.active{background-color:var(--color-accent);color:#fff}.wb-tool-btn svg{width:24px;height:24px}.wb-action-btn{padding:8px 16px;border-radius:var(--radius-sm);cursor:pointer;font-weight:500;border:none}.wb-action-btn.primary{background-color:var(--color-accent);color:#fff}.wb-action-btn.secondary{background-color:transparent;color:var(--color-text-main);border:1px solid var(--color-border-dark)}.whiteboard-canvas-wrapper{flex:1;position:relative;overflow:hidden}.whiteboard-svg{position:absolute;top:0;left:0;width:100%;height:100%}.whiteboard-svg [data-shape-id]{cursor:pointer}.selection-box{stroke:#007aff;stroke-width:1;stroke-dasharray:5,5;fill:none;pointer-events:none}.wb-text-input{position:absolute;border:2px solid;padding:10px;border-radius:10px;font-family:sans-serif;font-size:16px;min-width:150px;min-height:40px;resize:both;outline:none;z-index:10}.wb-text-content{border:2px solid transparent;padding:10px;border-radius:10px;font-family:sans-serif;font-size:16px;min-width:150px;min-height:40px;word-wrap:break-word;display:inline-block}.layout-root,.v-box{display:flex;flex-direction:column}.h-box{display:flex;flex-direction:row}.layout-resizer{background-color:var(--color-resizer);flex-shrink:0;transition:background-color .2s;position:relative}.layout-resizer:hover{background-color:var(--color-resizer-hover)}.layout-resizer-h{height:6px;cursor:row-resize}.layout-resizer-v{width:1px;background-color:var(--color-border-dark);cursor:col-resize}.layout-topbar{padding:var(--spacing-md) var(--spacing-lg);background-color:var(--color-bg-panel);color:var(--color-text-main);display:flex;align-items:center;flex-shrink:0;border-bottom:1px solid var(--color-border-dark)}.layout-back-link{color:var(--color-text-main);text-decoration:none;display:inline-flex;align-items:center;gap:var(--spacing-sm, 4px);padding:var(--spacing-sm, 4px) var(--spacing-md, 8px);border-radius:var(--border-radius-sm, 3px);transition:background-color .15s ease-out}.layout-back-link:hover{background-color:var(--color-resizer-hover)}.layout-back-link:before{content:"←";font-size:16px}.tabs{display:flex;flex-direction:column;overflow:hidden}.tab-header{display:flex;flex-shrink:0;border-bottom:1px solid var(--color-border-dark)}.tab-button{padding:var(--spacing-sm) var(--spacing-lg);border:none;background-color:transparent;color:var(--color-text-secondary);cursor:pointer;font-size:var(--font-size-md);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .2s,border-color .2s}.tab-button:hover{color:var(--color-text-main)}.tab-button.active{color:var(--color-text-main);border-bottom-color:var(--color-accent)}.tab-content-container{flex-grow:1;position:relative;overflow-y:auto}.tab-panel{display:none;height:100%;width:100%}.tab-panel.active{display:block}.panel{box-sizing:border-box;display:flex;flex-direction:column}.panel-bg-primary{background-color:var(--color-bg-darker)}.panel-bg-secondary{background-color:var(--color-bg-panel)}.panel-border-top{border-top:1px solid var(--color-border-dark)}.panel-border-bottom{border-bottom:1px solid var(--color-border-dark)}.view3d-settings-panel{padding:var(--spacing-md);color:var(--color-text-main);font-family:var(--font-family-main);height:100%;overflow-y:auto}.view3d-settings-panel h3{margin-top:0;margin-bottom:var(--spacing-lg);font-size:var(--font-size-lg);color:var(--color-text-highlight)}.view3d-settings-panel h4{margin-top:var(--spacing-xl);margin-bottom:var(--spacing-md);font-size:var(--font-size-md);color:var(--color-text-secondary);border-bottom:1px solid var(--color-border-main);padding-bottom:var(--spacing-sm)}.setting-group{margin-bottom:var(--spacing-lg)}.icon-group{display:flex;background-color:var(--color-bg-dark);padding:2px;border-radius:4px;gap:1px}.icon-btn{flex:1;display:flex;align-items:center;justify-content:center;background:transparent;border:none;padding:6px;cursor:pointer;color:var(--color-text-secondary);border-radius:3px;transition:all .2s}.icon-btn:hover{background-color:var(--color-bg-hover, rgba(255, 255, 255, .1));color:var(--color-text-main)}.icon-btn.active{background-color:var(--color-primary);color:#fff}.icon-btn svg{width:20px;height:20px;display:block}:host{display:block;height:100%}.wb-take-snapshot-card{width:100%;height:120px;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-border-dark);border-radius:var(--radius-sm);background-color:var(--color-bg-secondary);cursor:pointer;transition:background-color .2s;box-sizing:border-box;flex-shrink:0}.wb-take-snapshot-card:hover{background-color:var(--color-bg-hover)}.wb-control-container{display:flex;flex-direction:column;gap:var(--spacing-md);height:100%}.wb-control-btn{display:flex;align-items:center;justify-content:center;padding:var(--spacing-sm) var(--spacing-md);border:none;border-radius:var(--radius-sm);cursor:pointer;font-weight:500;font-size:var(--font-size-md);transition:background-color .2s}.wb-control-btn.primary{background-color:var(--color-accent);color:#fff}.wb-control-btn.primary:hover{background-color:var(--color-accent-hover)}.wb-snapshots-list{display:flex;flex-direction:column;gap:var(--spacing-sm);overflow-y:auto;flex:1;min-height:0;overflow-x:hidden}.wb-snapshot-item{position:relative;border:1px solid var(--color-border-dark);border-radius:var(--radius-sm);overflow:hidden;cursor:pointer;box-sizing:border-box;flex-shrink:0}.wb-snapshot-thumb{width:100%;height:120px;display:flex;align-items:center;justify-content:center;background-color:var(--color-bg-secondary);overflow:hidden}.wb-snapshot-thumb-svg{max-width:100%;max-height:100%}.wb-snapshot-actions{display:flex;justify-content:flex-end;padding:4px;background:var(--color-bg-panel);gap:8px}.wb-snapshot-actions button{background:none;border:none;cursor:pointer;font-size:16px;padding:2px}.wb-snapshot-actions button:hover{opacity:.7}.session-container{display:flex;flex-direction:column;height:100vh;width:100%}:root{--color-bg-overlay: rgba(36, 41, 46, .5);--color-bg-overlay-light: rgba(36, 41, 46, .2);--color-bg-dark: #e7e7e7;--color-bg-darker: #ffffff;--color-bg-panel: #f3f3f3;--color-bg-input-area: #e7e7e7;--color-bg-input: #ffffff;--color-primary: #007acc;--color-secondary: #e7e7e7;--color-success: #28a745;--color-error: #dc3545;--color-text-main: #24292e;--color-text-inverted: #ffffff;--color-border-light: #24292e;--color-border-dark: #dddddd;--color-border-hover: #007acc;--color-resizer: #e7e7e7;--color-resizer-hover: #007acc;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 10px;--spacing-lg: 20px;--spacing-xl: 30px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-round: 50%;--font-size-sm: 12px;--font-size-md: 14px;--font-size-lg: 18px;--z-index-video: 50;--z-index-overlay: 1000}