:root{--background-color:#161616;--text-color:#f4f4f4;--primary-color:#0f62fe;--secondary-color:#78a9ff;--border-color:#393939;--hover-color:#353535;--cds-background:var(--background-color);--cds-text-01:var(--text-color);--cds-interactive-01:var(--primary-color);--cds-interactive-02:var(--secondary-color);--cds-ui-background:var(--hover-color);--cds-border-strong-01:var(--border-color);--cds-spacing-01:0.125rem;--cds-spacing-02:0.25rem;--cds-spacing-03:0.5rem;--cds-spacing-04:0.75rem;--cds-spacing-05:1rem;--cds-spacing-06:1.5rem;--cds-spacing-07:2rem;--cds-spacing-08:2.5rem;--cds-spacing-09:3rem}*{box-sizing:border-box;padding:0;margin:0}body,html{max-width:100vw;min-height:100vh;overflow-x:hidden;font-family:IBM Plex Mono,monospace;background-color:var(--cds-ui-background);color:var(--cds-text-01)}a{color:inherit;text-decoration:none}button,input{font-family:IBM Plex Mono,monospace}main{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:var(--cds-spacing-05)}.container{max-width:800px;width:100%;border:1px solid var(--border-color);border-radius:8px;padding:var(--cds-spacing-07)}.button{background-color:var(--cds-interactive-01);color:#fff;border:none;border-radius:4px;padding:var(--cds-spacing-03) var(--cds-spacing-05);cursor:pointer;font-weight:500;font-family:IBM Plex Mono,monospace}.button:hover{background-color:var(--cds-interactive-02)}.button:focus{outline:2px solid var(--cds-interactive-01);outline-offset:2px}.input{background-color:transparent;border:1px solid var(--border-color);border-radius:4px;padding:var(--cds-spacing-03) var(--cds-spacing-04);color:var(--text-color);width:100%;font-family:IBM Plex Mono,monospace}.input:focus{outline:2px solid var(--cds-interactive-01);border-color:transparent}.text-heading-01{font-size:1rem;font-weight:600;line-height:1.375;letter-spacing:.16px}.text-heading-02{font-size:1.25rem;font-weight:600;line-height:1.4;letter-spacing:0}.text-heading-03{font-size:1.5rem;font-weight:400;line-height:1.4;letter-spacing:0}.text-body-01{font-size:.875rem;font-weight:400;line-height:1.429;letter-spacing:.16px}.text-body-02{font-size:1rem;font-weight:400;line-height:1.5;letter-spacing:0}.chat-page{display:flex;flex-direction:column;height:100vh;width:100%;overflow:hidden;position:relative}.chat-header,.chat-page{background-color:var(--cds-background)}.chat-header{border-bottom:1px solid var(--cds-border-strong-01);position:fixed;top:0;left:0;right:0;z-index:1500;height:48px}.back-button{margin-right:var(--cds-spacing-03);transition:transform .11s ease}.back-button:hover{transform:translateX(-2px)}.room-tag{margin-left:var(--cds-spacing-03)}.status-tag{margin-right:var(--cds-spacing-03)}.chat-container{position:fixed;top:48px;left:0;right:0;bottom:0;height:calc(100vh - 48px)}.chat-container,.chat-unified-tile{display:flex;flex-direction:column;overflow:hidden;background-color:var(--cds-background)}.chat-unified-tile{height:100%;width:100%;border-radius:0;box-shadow:none}.chat-room-header{display:flex;justify-content:center;align-items:center;width:100%;position:relative;z-index:50;height:auto;min-height:70px}.chat-title-container{display:flex;align-items:center;gap:var(--cds-spacing-03)}.chat-title-container h3{margin:0;font-size:1rem;font-weight:600}.chat-messages-area{position:relative;display:flex;flex-direction:column;height:calc(100% - 60px - 80px);overflow:hidden}.messages-container{width:100%;height:100%;overflow-y:auto;padding:var(--cds-spacing-05);display:flex;flex-direction:column-reverse;gap:var(--cds-spacing-04);scrollbar-width:thin;scrollbar-color:var(--cds-border-subtle-01) transparent}.chat-input-area{display:flex;gap:var(--cds-spacing-03);height:80px;width:100%;position:relative;z-index:50}.send-button{flex-shrink:0;min-width:120px}.notification-wrapper{position:fixed;top:60px;right:16px;z-index:9500;max-width:400px;width:auto}.chat-message{margin-bottom:var(--cds-spacing-04);width:100%;border-left:4px solid transparent;transition:all .2s ease;border-radius:4px;padding:var(--cds-spacing-04)}.chat-message-mine{border-left-color:#0f62fe;margin-left:auto}.chat-message-mine,.chat-message-others{max-width:calc(100% - 30%);background-color:#262626;color:#f4f4f4}.chat-message-others{border-left-color:#4589ff;margin-right:auto;box-shadow:0 1px 2px rgba(0,0,0,.1)}.chat-message-header{display:flex;align-items:center;gap:var(--cds-spacing-03);margin-bottom:var(--cds-spacing-03)}.chat-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:14px}.chat-message-sender{font-weight:500}.chat-message-text{font-size:.875rem;line-height:1.5;word-break:break-word;white-space:pre-wrap;margin-bottom:var(--cds-spacing-03)}.chat-message-timestamp{font-size:.75rem;color:var(--cds-text-secondary);text-align:right}.chat-loading{display:flex;justify-content:center;align-items:center;height:100%;min-height:200px}.chat-loading-indicator{margin:0 auto}.chat-message-mine .chat-avatar{background-color:#0f62fe;color:#fff}.chat-message-others .chat-avatar{background-color:#4589ff;color:#161616}.chat-message-mine .chat-message-sender,.chat-message-mine .chat-message-text,.chat-message-others .chat-message-sender,.chat-message-others .chat-message-text{color:#f4f4f4}.chat-message-mine .chat-message-timestamp,.chat-message-others .chat-message-timestamp{color:#c6c6c6}.cds--g100 .chat-message-mine,.cds--g100 .chat-message-others{background-color:#262626;border-left-color:#0f62fe}.cds--g100 .chat-message-others{color:#f4f4f4}.cds--g100 .chat-message-others .chat-message-sender{color:#f4f4f4;font-weight:500}.cds--g100 .chat-message-others .chat-message-timestamp{color:#c6c6c6}.input-wrapper{display:flex;flex-direction:column;width:100%;margin-bottom:var(--cds-spacing-03)}.input-label{margin-bottom:var(--cds-spacing-02);color:var(--cds-text-01)}.input-invalid{border-color:#da1e28}.input-error-message{font-size:.75rem;color:#da1e28;margin-top:var(--cds-spacing-02)}.input-sm{padding:var(--cds-spacing-02) var(--cds-spacing-03);height:2rem}.input-lg{padding:var(--cds-spacing-04) var(--cds-spacing-05);height:3rem}.button-secondary{background-color:transparent;border:1px solid var(--cds-interactive-01);color:var(--cds-interactive-01)}.button-secondary:hover{background-color:rgba(15,98,254,.1)}.button-danger{background-color:#da1e28}.button-danger:hover{background-color:#b81922}.button-ghost{background-color:transparent;color:var(--cds-interactive-01)}.button-ghost:hover{background-color:rgba(15,98,254,.1)}.button-sm{padding:var(--cds-spacing-02) var(--cds-spacing-04);font-size:.875rem}.button-lg{padding:var(--cds-spacing-04) var(--cds-spacing-06);font-size:1rem}.chat-send-container{display:flex;gap:var(--cds-spacing-03);margin-top:var(--cds-spacing-05);width:100%}.chat-send-input{flex:1 1}.chat-header-title{display:flex;align-items:center;gap:var(--cds-spacing-03)}.landing-container{width:100%;max-width:100%;padding:0;min-height:100vh;margin:0;display:flex;align-items:center;justify-content:center}.home-page{min-height:100vh;background-color:var(--cds-background)}.welcome-column{display:flex;justify-content:center;padding:var(--cds-spacing-07)}.welcome-tile{max-width:800px;padding:var(--cds-spacing-07)}.welcome-content{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.welcome-icon{color:var(--cds-interactive-01);margin-bottom:var(--cds-spacing-05);align-self:flex-start}.welcome-title{margin-bottom:var(--cds-spacing-05);text-align:left;width:100%}.welcome-description{margin-bottom:var(--cds-spacing-07);max-width:600px;text-align:left;width:100%}.welcome-actions{display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;gap:var(--cds-spacing-05);width:100%;margin-top:var(--cds-spacing-05)}.welcome-button{min-width:180px}.welcome-divider{margin:0 var(--cds-spacing-03);font-weight:600;align-self:center;display:flex;align-items:center;height:100%}@media (max-width:672px){.welcome-actions{flex-direction:column;gap:var(--cds-spacing-05);align-items:flex-start}.welcome-button{min-width:240px;width:100%}.welcome-divider{margin:var(--cds-spacing-03) 0;align-self:flex-start;padding-left:var(--cds-spacing-05)}}@media (max-width:480px){.welcome-actions{flex-direction:column;width:100%;align-items:flex-start}.welcome-button{width:100%;min-width:unset}.welcome-divider{margin:var(--cds-spacing-03) 0;align-self:flex-start;padding-left:var(--cds-spacing-05)}}.landing-column{display:flex;align-items:center;justify-content:center;width:100%}.landing-tile{width:100%;max-width:600px;background-color:var(--cds-ui-01);padding:var(--cds-spacing-07);border-radius:4px;border:1px solid var(--cds-border-subtle-01)}.landing-heading{font-size:2rem;font-weight:400;text-align:center;margin-bottom:var(--cds-spacing-07);color:var(--cds-text-01)}.join-button{margin-top:var(--cds-spacing-05);width:100%}.h2{font-size:1.25rem;font-weight:400;margin-bottom:var(--cds-spacing-05);color:var(--cds-text-01)}.chat-grid{display:flex;flex-direction:column;width:100%;height:100vh;background-color:var(--cds-background);position:relative;overflow:hidden;padding:0}@media (max-width:1056px){.chat-room-header{flex-direction:column;align-items:flex-start;height:auto;padding:var(--cds-spacing-03)}.room-link-container{width:100%;margin-top:var(--cds-spacing-03);max-width:none}.notification-wrapper{max-width:300px}.chat-messages-area{height:calc(100% - 104px - 80px)}}@media (max-width:672px){.chat-input-area{flex-direction:column;padding:var(--cds-spacing-03);height:120px}.send-button{width:100%;margin-top:var(--cds-spacing-03);min-width:unset}.messages-container{padding:var(--cds-spacing-03)}.chat-messages-area{height:calc(100% - 104px - 120px)}.chat-message{max-width:85%}.chat-message-mine{margin-left:15%}.chat-message-others{margin-right:15%}}@media (max-width:320px){.chat-container{top:48px;height:calc(100vh - 48px)}.chat-unified-tile{border-radius:0;box-shadow:none}.chat-input-area,.chat-room-header,.messages-container{padding:var(--cds-spacing-02)}.chat-message{max-width:90%;padding:var(--cds-spacing-03)}.chat-message-mine{margin-left:10%}.chat-message-others{margin-right:10%}}.carbon-link{display:inline-block;margin-top:var(--cds-spacing-05);font-size:.875rem;color:var(--cds-link-01);text-align:center;width:100%}.carbon-link:hover{color:var(--cds-link-02);text-decoration:underline}.cds--header__name svg{margin-right:var(--cds-spacing-05)}.room-info-container{justify-content:center;flex:1 1;margin:0 auto;position:absolute;left:50%;transform:translateX(-50%);z-index:0}.room-info-container,.room-tag{display:flex;align-items:center}.room-tag{gap:var(--cds-spacing-03);background-color:var(--cds-background-brand)!important;height:2rem!important;line-height:2rem!important;padding:0 var(--cds-spacing-05)!important;font-size:.875rem!important;border-radius:.5rem!important}.room-tag-icon{margin-right:var(--cds-spacing-02)}.status-tag-container{display:flex;align-items:center;margin-right:var(--cds-spacing-05);height:100%;z-index:1}.status-tag{display:flex!important;align-items:center!important;gap:var(--cds-spacing-02);padding:0 var(--cds-spacing-04)!important;height:2rem!important;border-radius:.5rem!important;font-size:.875rem!important}.status-icon{display:inline-flex;flex-shrink:0}.status-loading{height:2rem!important;min-width:120px;align-items:center;padding:0 var(--cds-spacing-03)}.status-loading .cds--inline-loading__text{font-size:.875rem;color:var(--cds-text-01)}.message-input-group{display:flex;align-items:flex-end;width:100%;background-color:var(--cds-layer);border:none;border-radius:8px;padding:var(--cds-spacing-03);position:relative}.message-input{flex:1 1;width:100%;position:relative}.message-input .cds--text-input-wrapper{background-color:transparent;border:none;width:100%}.message-input .cds--text-input{background-color:transparent;border-bottom:1px solid var(--cds-border-subtle);transition:border-bottom-color .2s ease;width:calc(100% - var(--cds-spacing-07));padding-right:var(--cds-spacing-08)}.message-input .cds--text-input:focus{outline:none;box-shadow:none;border-bottom:2px solid var(--cds-interactive-01)}.send-button{position:absolute;right:var(--cds-spacing-05);bottom:var(--cds-spacing-05);padding:0;min-width:auto!important;width:20px;height:20px;margin:0;white-space:nowrap;justify-content:center;align-items:center;display:flex;z-index:10;outline:none!important}.send-button,.send-button:hover{background-color:transparent!important;box-shadow:none!important;border:none!important}.send-button svg{fill:#fff}.send-button.cds--btn--primary{background-color:transparent!important;border:none!important;box-shadow:none!important}.send-button span.cds--btn__icon{position:static;margin:0}.send-button .cds--inline-loading,.send-button span:not(.cds--btn__icon){display:none}.send-button.cds--btn{border:none!important;box-shadow:none!important;outline:none!important;background-color:transparent!important;min-height:auto!important;height:auto!important}.chat-header .cds--header__menu-toggle{display:none}.chat-room-header{border-bottom:1px solid var(--cds-border-subtle)}.chat-input-area,.chat-room-header{padding:var(--cds-spacing-05);background-color:var(--cds-layer-01)}.chat-input-area{border-top:1px solid var(--cds-border-subtle)}.chat-messages-area{flex:1 1;overflow-y:auto;background-color:var(--cds-layer);padding:var(--cds-spacing-05)}.chat-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--cds-spacing-09);text-align:center;margin:var(--cds-spacing-07) auto;max-width:400px;border-radius:var(--cds-border-radius-lg);background-color:var(--cds-layer-hover)}.chat-empty-icon{margin-bottom:var(--cds-spacing-05);color:var(--cds-interactive-01)}.room-link-container{display:flex;gap:var(--cds-spacing-03);max-width:600px;margin:0 auto}.room-link-input input{padding-right:var(--cds-spacing-09)}@media (max-width:768px){.room-info-container{position:static;transform:none;padding:0 var(--cds-spacing-03)}.room-tag{font-size:.75rem!important;padding:0 var(--cds-spacing-03)!important;height:1.5rem!important;line-height:1.5rem!important}.status-tag-container{margin-right:var(--cds-spacing-03)}.status-tag{font-size:.75rem!important;padding:0 var(--cds-spacing-03)!important;height:1.5rem!important}.status-loading{min-width:90px}.cds--header__name{font-size:.875rem}.send-button{min-width:90px}}.app-title,.chat-header-name{display:flex;align-items:center}.app-title{gap:var(--cds-spacing-03)}.app-title svg{margin-right:var(--cds-spacing-02)}.chat-tabs-container{flex:1 1;display:flex;justify-content:center;align-items:center;max-width:600px;margin:0 auto}.cds--tabs{width:auto;margin:0 auto}.cds--tab-list{background-color:transparent;border-bottom:none}.room-tab{padding:0;height:32px;max-width:200px}.room-tab-content{display:flex;align-items:center;gap:var(--cds-spacing-03);padding:0 var(--cds-spacing-05);height:100%}.room-tab-content svg{flex-shrink:0}.room-share-container{display:flex;justify-content:center;width:100%;max-width:800px;margin:0 auto;padding:var(--cds-spacing-03)}.room-link-compact{display:flex;align-items:center;gap:var(--cds-spacing-03);width:100%;max-width:600px;margin:0 auto;background-color:var(--cds-layer);border:1px solid var(--cds-border-subtle);border-radius:8px;padding:var(--cds-spacing-04);height:48px;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:all .2s ease}.room-link-compact:hover{border-color:var(--cds-focus);box-shadow:0 1px 5px rgba(0,0,0,.15)}.room-link-label{display:flex;align-items:center;justify-content:center;color:var(--cds-text-02);width:32px;height:32px;flex-shrink:0}.room-link-input{flex:1 1;max-width:none;background-color:transparent}.room-link-input input{background-color:transparent;border-bottom:none;height:32px;color:var(--cds-text-01);font-family:IBM Plex Mono,monospace}.room-link-input .cds--text-input-wrapper{background-color:transparent;border:none}.room-link-input .cds--text-input:focus{outline:none;box-shadow:none}@media (max-width:768px){.room-share-container{padding:var(--cds-spacing-02)}.room-link-compact{height:36px;padding:var(--cds-spacing-01)}.room-link-label{width:28px;height:28px}.room-link-input input{height:28px;font-size:.75rem}}.chat-container{max-width:1000px;margin:0 auto;width:100%;padding:0 var(--cds-spacing-05)}@media (max-width:768px){.app-title{display:none}.chat-tabs-container{flex:0 1;margin:0}.room-tab{max-width:150px}.connection-text{display:none}.room-share-container{flex-direction:column;padding:var(--cds-spacing-02)}.room-share-label{font-size:.75rem}.chat-container{padding:0}}@media (max-width:480px){.room-tab{max-width:120px}.room-tab-content{padding:0 var(--cds-spacing-03);font-size:.75rem}}.connection-status{display:flex;align-items:center;gap:var(--cds-spacing-03);margin-right:var(--cds-spacing-05);height:100%;padding:0 var(--cds-spacing-03)}.connection-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.connection-dot.connected{background-color:#24a148;box-shadow:0 0 4px #24a148}.connection-dot.connecting{background-color:#8a3ffc;box-shadow:0 0 4px #8a3ffc}.connection-dot.error{background-color:#da1e28;box-shadow:0 0 4px #da1e28}.connection-text{font-size:.75rem;color:var(--cds-text-02)}.connection-status-loading{margin-right:var(--cds-spacing-05);height:100%;display:flex;align-items:center}