.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:#2c2c2c;padding:25px;border-radius:8px;box-shadow:0 4px 15px #00000080;width:90%;max-width:450px;border-top:3px solid #007bff}.modal-content h2{margin-top:0;color:#f0f0f0;font-size:1.4rem}.modal-content p{color:#ccc;line-height:1.6;margin-bottom:20px}.modal-content label{display:block;color:#ccc;margin-bottom:5px;font-size:.9rem}.modal-input{width:100%;padding:10px;margin-bottom:15px;background-color:#333;border:1px solid #555;color:#fff;border-radius:5px;box-sizing:border-box}.modal-input:disabled{background-color:#444;cursor:not-allowed}.input-with-button{position:relative;display:flex;align-items:center;margin-bottom:15px;width:100%;box-sizing:border-box}.input-with-button .modal-input{margin-bottom:0}.clear-button{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:#555;border:none;color:#fff;padding:5px 10px;border-radius:5px;cursor:pointer}.clear-button:hover{background:#666}.role-selector{margin-bottom:20px;color:#ccc}.role-selector label{margin-right:20px;cursor:pointer}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:25px}.cancel-button,.save-button{padding:10px 18px;border:none;border-radius:5px;cursor:pointer;font-weight:700;transition:background-color .2s,transform .2s}.cancel-button{background-color:#555;color:#fff}.cancel-button:hover{background-color:#666;transform:translateY(-1px)}.save-button{background-color:#007bff;color:#fff}.save-button:hover{background-color:#0056b3;transform:translateY(-1px)}.save-button:disabled{background-color:#004494;cursor:not-allowed;transform:none}.recent-rooms-dropdown{position:absolute;top:calc(100% + 10px);right:0;width:320px;background-color:#2c2c31;border:1px solid #444;border-radius:8px;box-shadow:0 8px 24px #0006;z-index:1010;padding:16px}.recent-rooms-title{font-size:1.1rem;color:#eaeaea;margin-top:0;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid #444}.recent-rooms-list{list-style:none;padding:0;margin:0}.recent-room-item{margin-bottom:8px}.recent-room-link{display:block;text-decoration:none;padding:10px;border-radius:6px;transition:background-color .2s}.recent-room-link:hover{background-color:#38383e}.recent-room-info{display:flex;flex-direction:column}.recent-room-name-container{display:flex;align-items:center;gap:8px}.recent-room-name{font-weight:500;color:#d0d0d0;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-only-badge{background-color:#5a5a66;color:#e0e0e0;padding:2px 6px;border-radius:4px;font-size:.7rem;font-weight:700;text-transform:uppercase}.owner-badge{background-color:#2a2f36;color:#0d99ff;padding:2px 6px;border-radius:4px;font-size:.7rem;font-weight:700;border:1px solid #0D99FF}.recent-room-title{font-size:.8rem;color:#909090;margin-top:4px}.no-recent-rooms{font-size:.9rem;color:#a0a0a0;text-align:center;padding:20px 0}.chip{display:flex;align-items:center;gap:8px;background-color:#2a2f36;padding:2px 8px;border-radius:16px;border:1px solid #3D444D}.avatar{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11px;color:#fff}.user-info{display:flex;flex-direction:column;align-items:flex-start}.name{color:#f0f0f0;font-weight:400;font-size:13px}.role{color:#a0a0a0;font-size:11px}.badge{background-color:#4a5461;color:#c1c8d2;padding:2px 6px;border-radius:4px;font-size:10px;font-weight:700;margin-left:auto;background-color:#add8e6}body{background:linear-gradient(180deg,#2a2a2e,#1e1e21);color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.home-container{background-image:url(/background.png);display:flex;align-items:center;justify-content:center;min-height:90vh;padding:2rem;gap:4rem;width:100%;box-sizing:border-box;position:relative;overflow:hidden}.beta-banner{position:absolute;bottom:70px;right:-80px;background-color:red;color:#fff;padding:10px 150px;font-weight:700;transform:rotate(-45deg);text-align:center;font-size:1rem;z-index:0}.home-header{position:absolute;top:2rem;left:2rem;right:2rem;display:flex;align-items:center;justify-content:space-between}.logo-section{display:flex;align-items:center;gap:.75rem}.logo-section .logo{width:40px;height:40px}.logo-section .product-name{font-size:1.5rem;font-weight:600}.content-column{flex:1;max-width:550px;display:flex;flex-direction:column;align-items:flex-start}.hero-title{font-size:3.5rem;font-weight:700;line-height:1.2;margin-bottom:1rem;color:#fff}.hero-subtitle{font-size:1.15rem;color:#a0a0a0;margin-bottom:2.5rem;max-width:450px}.input-form{display:flex;width:100%;max-width:500px;background-color:#2c2c31;border-radius:8px;border:1px solid #444;transition:box-shadow .3s ease}.input-form:focus-within{box-shadow:0 0 12px 2px #007bff99;border-color:#007bff}.url-input{flex-grow:1;background-color:transparent;border:none;color:#fff;padding:1rem;font-size:1rem;outline:none}.create-room-button{background-color:#333338;color:#bdbdc2;border:none;border-left:1px solid #444;padding:0 1.5rem;font-size:1rem;font-weight:600;border-radius:0 8px 8px 0;cursor:pointer;transition:background-color .2s ease,color .2s ease}.create-room-button:hover{background-color:#007bff;color:#fff}.create-room-button:disabled{cursor:not-allowed;opacity:.5}.image-column{flex:1.4;display:flex;align-items:center;justify-content:center;padding-top:45px}.browser-frame{background-color:#1a1a1d;border-radius:12px;box-shadow:0 20px 60px #185bae1a;border:1px solid #444;padding:0 10px 10px}.browser-header{height:40px;display:flex;align-items:center;padding:0 12px;border-bottom:1px solid #3a3a3d;margin-bottom:12px}.browser-controls{display:flex;gap:8px}.control-dot{width:12px;height:12px;border-radius:50%}.control-dot:nth-child(1){background-color:#ff5f56}.control-dot:nth-child(2){background-color:#ffbd2e}.control-dot:nth-child(3){background-color:#27c93f}.product-image{max-width:100%;height:auto;border-radius:0 0 8px 8px;box-shadow:none}.home-footer{position:absolute;bottom:0;width:100%;display:flex;justify-content:center;align-items:center;padding:1rem;background-color:#1a1a1d;color:#a0a0a0;font-size:.9rem;border-top:1px solid #333}.home-footer p{margin:0 1rem}.home-footer a{color:#007bff;text-decoration:none}.home-footer a:hover{text-decoration:underline}.commentsSection{background-color:#15181c;border-left:1px solid #3D444D;padding:0;height:100%;display:flex;flex-direction:column}.commentsHeader{padding:15px;background-color:#191c20;border-bottom:1px solid #3D444D}.commentsHeader h3{margin:0;font-size:18px;font-weight:600}.commentsList{flex-grow:1;overflow-y:auto;padding:15px}.commentCard{background-color:#101214;border-radius:4px;margin-bottom:15px;padding:12px;border:1px solid #000}.commentHeader{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px}.commentIdentity{display:flex;align-items:center}.commentAvatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;margin-right:10px}.commentAuthorInfo{display:flex;flex-direction:column}.commentAuthorInfo>div{display:flex;align-items:baseline;gap:8px}.commentAuthor{font-weight:600;font-size:14px;margin-right:8px}.commentTitle{font-size:12px;color:#94a3b8;background-color:#333c4a;padding:2px 6px;border-radius:4px}.commentTimeAgo{font-size:12px;color:#94a3b8}.commentBody{font-size:14px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word}.deleteButton{background:none;border:none;color:#94a3b8;cursor:pointer;font-size:12px}.composerContainer{padding:15px;background-color:#2c2c31;border-radius:8px;border:1px solid #444;transition:box-shadow .3s ease;margin:15px}.composerContainer:focus-within{box-shadow:0 0 12px 2px #007bff99;border-color:#007bff}.composerTextarea{width:100%;background-color:transparent;color:#f8fafc;border:none;padding:0;font-family:inherit;font-size:14px;resize:none;min-height:50px;box-sizing:border-box}.composerTextarea:focus{outline:none}.header{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background-color:#1a202c;border-bottom:1px solid var(--border-color)}.branding{display:flex;align-items:center;gap:8px}.logo{height:24px}.productName{color:#cbd5e1;font-size:13px;font-weight:500;white-space:nowrap}.videoTitleContainer{flex:1;text-align:center;min-width:0;padding:0 16px}.videoTitle{color:var(--text-light);font-size:16px;font-weight:600;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.userContainer{display:flex;align-items:center;justify-content:flex-end;gap:16px;min-width:150px}.shareButton,.copiedButton{min-width:110px;text-align:center;padding:6px 14px;border:none;border-radius:6px;color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease-in-out,width .2s ease-in-out;white-space:nowrap}.shareButton{background-color:#28a745}.shareButton:hover{background-color:#218838}.copiedButton{background-color:#28a745;cursor:default}.page{display:flex;flex-direction:column;height:100vh;max-height:100vh;background-color:#0b0e10;color:var(--text-light)}.mainContent{flex-grow:1;overflow:hidden;padding:16px}.statusContainer{display:flex;align-items:center;justify-content:center;height:100vh;background-color:#0b0e10;color:#9ba3ae;font-size:18px}:root{--primary-brand: #007bff;--primary-brand-hover: #0056b3;--text-light: #e6e6e6;--text-dark: #1a1d21;--background-dark: #1a1d21;--background-light: #ffffff;--border-color: #2D3748;--scrollbar-track: #2c2c2c;--scrollbar-thumb: #555;--scrollbar-thumb-hover: #777;--disabled-bg: #333;--border-radius-sm: 0;--border-radius-md: 0}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--background-dark);color:var(--text-light);overflow-x:hidden}h2{color:var(--text-light);font-weight:500}button{background-color:var(--primary-brand);color:var(--background-light);border:none;padding:10px 15px;border-radius:var(--border-radius-md);cursor:pointer;font-size:1rem;transition:background-color .2s ease-in-out}button:hover{background-color:var(--primary-brand-hover)}button:disabled{background-color:var(--disabled-bg);cursor:not-allowed}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--scrollbar-track)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:0}::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}.text-input{width:100%;padding:8px;margin-bottom:10px;border-radius:var(--border-radius-md);border:1px solid var(--border-color);background-color:#2d3748;color:var(--text-light)}.commentComposer{position:relative;margin:8px 0;border:1px solid #333;border-radius:8px;background-color:#282c34;padding:28px 12px 12px}.cancelButton{position:absolute;top:8px;right:8px;background:transparent;border:none;color:#aaa;font-size:24px;cursor:pointer;line-height:1;padding:0;font-weight:700}.cancelButton:hover{color:#fff}.composerTextarea{width:100%;height:80px;background-color:#282c34;color:#eaeaea;border:none;border-radius:4px;padding:8px;box-sizing:border-box;resize:vertical;outline:none;font-family:inherit;font-size:1rem}.postButton{background-color:#0d99ff;color:#fff;border:none;border-radius:5px;padding:8px 16px;cursor:pointer;font-size:.9rem;float:right;margin-top:8px;transition:background-color .2s}.postButton:disabled{background-color:#555;cursor:not-allowed}.postButton:hover:not(:disabled){background-color:#07c}