:root{font-family:Inter,system-ui,sans-serif;color:#18212f;background:#f1f4f7;--line:#e9edf2;--green:#12a780;--orange:#f39817;--panel:#fff}*{box-sizing:border-box}body{margin:0;height:100dvh;min-height:510px;overflow:hidden;background:#f1f4f7;color:#18212f}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}.topbar{height:66px;background:#151b2a;color:white;display:flex;align-items:center;padding:0 26px;gap:25px;box-shadow:0 2px 12px #11182718;z-index:2}.brand{display:flex;align-items:center;gap:9px;color:#fff;text-decoration:none;font-weight:800;font-size:19px;letter-spacing:-.7px}.brand small{font-size:10px;color:#a9b2c5;margin-left:2px}.brand-accent,.login-brand h1 span{color:#53dbb1}.brand-mark{width:31px;height:31px;border-radius:10px;background:linear-gradient(145deg,#16c79a,#078b70);color:white;display:grid;place-items:center;font-size:24px;box-shadow:0 5px 12px #0b9d7c55}.network-state{margin:auto;display:flex;align-items:center;gap:8px;color:#bac3d1;font-size:11px}.network-state i,.group-label i{width:8px;height:8px;border-radius:50%;background:#2acb91;box-shadow:0 0 0 3px #2acb9122}.network-state b{color:#fff;background:#263247;border-radius:20px;padding:4px 9px;font-size:10px}.top-actions{display:flex;align-items:center;gap:12px}.icon-btn{border:0;background:transparent;color:inherit;width:36px;height:36px;border-radius:9px;font-size:18px}.profile-pill{display:flex;align-items:center;gap:8px;border:1px solid #ffffff24;background:#ffffff0b;color:white;border-radius:22px;padding:5px 11px 5px 5px;font-size:11px}.profile-pill #myAvatar{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#d7f5eb;color:#078568;font-weight:700}.profile-pill b{color:#aab3c3;margin-left:4px}.layout{height:calc(100dvh - 66px);display:grid;grid-template-columns:220px minmax(0,1fr) 250px;gap:0;padding:14px;max-width:1600px;margin:auto}.left-rail,.chat-panel,.right-panel{background:var(--panel);min-height:0}.left-rail{border:1px solid var(--line);border-right:0;border-radius:14px 0 0 14px;display:flex;flex-direction:column;padding:19px 13px 12px}.rail-title{display:flex;align-items:center;justify-content:space-between;padding:0 5px;height:30px;font-size:9px;font-weight:700;letter-spacing:1px;color:#99a2ae}.rail-title button{border:0;background:#f0f3f6;color:#647384;border-radius:7px;width:25px;height:25px;font-size:17px}.room-list{padding-top:12px;display:flex;flex-direction:column;gap:4px}.room{border:0;background:transparent;border-radius:9px;height:41px;display:flex;align-items:center;gap:10px;padding:0 10px;text-align:left;color:#687485;font-size:12px}.room:hover{background:#f5f8fa}.room.active{color:#078967;background:#e9f8f2;font-weight:600}.room .hash{font-size:17px;color:#9aa5b1}.room.active .hash{color:#16a880}.room-live{margin-left:auto;width:6px;height:6px;background:#27bd87;border-radius:50%}.rail-bottom{margin-top:auto}.secure-card{display:flex;gap:9px;align-items:center;padding:10px 8px;background:#f6f9f8;border:1px solid #edf2ef;border-radius:10px}.secure-card>b{width:28px;height:28px;border-radius:8px;background:#e0f5ed;color:#0a9b73;display:grid;place-items:center}.secure-card strong,.secure-card small{display:block}.secure-card strong{font-size:9px}.secure-card small{font-size:8px;color:#98a2ae;margin-top:3px}.rail-bottom>button{border:0;background:transparent;padding:14px 6px 2px;color:#8e98a7;font-size:10px}.chat-panel{display:flex;flex-direction:column;border:1px solid var(--line);min-width:0}.chat-heading{height:65px;flex:none;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 18px;gap:11px}.room-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#e7f7f1;color:#109c75;font-size:21px}.chat-heading>div:nth-child(2){display:flex;flex-direction:column;gap:4px}.chat-heading strong{text-transform:capitalize;font-size:13px}.chat-heading small{color:#909aa8;font-size:9px}.chat-heading .icon-btn{margin-left:auto;color:#8792a0}.connection-notice{height:29px;display:flex;align-items:center;justify-content:center;gap:8px;color:#8792a0;font-size:9px;background:#fbfcfd;border-bottom:1px solid #f0f2f5;flex:none}.connection-notice i{width:10px;height:10px;border:2px solid #d7e8e2;border-top-color:#18a881;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.connection-notice.connected{color:#168c68;background:#f4fbf8}.connection-notice.connected i{border:0;background:#23bd89;animation:none;width:6px;height:6px}.connection-notice.error{color:#c95460;background:#fff7f7}.connection-notice.error i{border:0;background:#df7680;animation:none;width:6px;height:6px}.message-list{flex:1;min-height:0;overflow:auto;padding:18px 23px;scroll-behavior:smooth}.date-divider{text-align:center;color:#aab2bd;font-size:8px;letter-spacing:1px;margin:2px 0 21px}.date-divider:before,.date-divider:after{content:"";display:inline-block;width:20%;height:1px;background:#edf0f3;vertical-align:middle;margin:0 12px}.welcome-card{margin:12px auto 25px;max-width:380px;text-align:center;padding:18px;border:1px dashed #e2e8ec;border-radius:13px;color:#657282}.welcome-card>b{width:34px;height:34px;border-radius:11px;background:#e9f8f3;color:#14a77f;display:grid;place-items:center;margin:0 auto 9px}.welcome-card strong{font-size:11px;color:#455262}.welcome-card p{font-size:9px;margin:5px 0 0;color:#9ba5b2}.system-message{max-width:92%;margin:6px auto 11px;text-align:center;color:#8993a1;font-size:9px}.system-message span{display:inline-block;background:#f6f8fa;padding:6px 11px;border-radius:20px}.chat-message{display:flex;gap:9px;margin:0 0 14px;max-width:88%;align-items:flex-start}.chat-message.mine{margin-left:auto;flex-direction:row-reverse}.msg-avatar,.user-avatar{width:28px;height:28px;border-radius:50%;background:#e7eefb;color:#5474a7;display:grid;place-items:center;font-size:10px;font-weight:700;flex:none}.chat-message.mine .msg-avatar{background:#def5eb;color:#078a68}.msg-body{min-width:0}.msg-meta{display:flex;gap:8px;align-items:baseline;margin:1px 0 4px}.msg-nick{font-weight:700;color:#3a4655;font-size:10px}.chat-message.mine .msg-nick{color:#0d9873}.msg-time{font-size:8px;color:#a4acb7}.msg-bubble{padding:9px 12px;border-radius:3px 12px 12px 12px;background:#f3f5f7;color:#374151;font-size:11px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}.chat-message.mine .msg-bubble{background:#e7f8f1;border-radius:12px 3px 12px 12px}.composer{margin:0 17px;border:1px solid #e3e8ed;border-radius:11px;min-height:47px;display:flex;align-items:center;gap:7px;padding:5px;background:#fff;box-shadow:0 3px 12px #1b25320a;flex:none}.composer:focus-within{border-color:#9bdcc7;box-shadow:0 0 0 3px #13a77e12}.composer>button{width:32px;height:32px;border:0;background:transparent;color:#84909d;border-radius:8px;font-size:16px}.composer>button:hover{background:#f0f5f4;color:#159a76}.composer input{border:0;outline:0;flex:1;min-width:30px;color:#303c4a;font-size:11px}.composer input::placeholder{color:#aeb6c0}.composer #sendBtn{width:auto;background:#11a780;color:white;border-radius:8px;padding:0 11px;display:flex;gap:10px;align-items:center;font-size:9px;font-weight:600}.composer #sendBtn b{font-size:13px}.composer-hint{text-align:center;padding:8px 2px 0;height:27px;flex:none;color:#a6afba;font-size:8px}.composer-hint span{margin:0 5px}.right-panel{border:1px solid var(--line);border-left:0;border-radius:0 14px 14px 0;padding:19px 14px 11px;display:flex;flex-direction:column}.people-heading{display:flex;align-items:center;gap:9px;margin:2px 3px 15px}.people-heading strong{font-size:12px}.people-heading>b,.group-label>b{font-size:8px;color:#169c76;background:#eaf8f2;border-radius:10px;padding:4px 7px}.people-search{height:33px;border:1px solid #edf0f3;background:#fafbfc;border-radius:8px;display:flex;align-items:center;gap:7px;padding:0 9px;color:#9aa3af}.people-search input{border:0;outline:0;background:transparent;min-width:0;width:100%;font-size:9px}.group-label{font-size:8px;font-weight:700;letter-spacing:.5px;color:#8b96a4;display:flex;align-items:center;gap:6px;margin-top:18px;padding:0 4px 9px;border-bottom:1px solid #f0f2f5}.group-label>b{margin-left:auto;background:#f2f4f6;color:#677485}.user-list{padding-top:6px;overflow:auto}.empty-users{font-size:9px;color:#a1aab6;line-height:1.55;padding:10px 4px}.user-row{height:37px;display:flex;align-items:center;gap:8px;padding:0 4px;border-radius:8px;cursor:pointer}.user-row:hover{background:#f6f8fa}.user-row:nth-child(4n+2) .user-avatar{background:#fff2dd;color:#b37b1b}.user-row:nth-child(4n+3) .user-avatar{background:#f2eaff;color:#8166bb}.user-row:nth-child(4n+4) .user-avatar{background:#e5f7f1;color:#188a69}.user-name{font-size:9px;color:#536071;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-rank{font-size:8px;color:#a3adba;margin-left:auto}.tip-card{margin-top:auto;display:flex;gap:8px;background:#f5faf8;border:1px solid #e8f4ef;border-radius:9px;padding:9px}.tip-card>b{font-size:14px}.tip-card strong,.tip-card small{display:block}.tip-card strong{font-size:8px}.tip-card small{font-size:8px;color:#8e9b9a;line-height:1.45;margin-top:4px}.server-foot{display:flex;justify-content:space-between;padding:11px 2px 2px;color:#9ea7b2;font-size:7px}.overlay{position:fixed;inset:66px 0 0;z-index:5;background:#12182677;backdrop-filter:blur(3px);display:grid;place-items:center;overflow:auto;padding:16px}.login-wrap{width:min(408px,100%);display:flex;align-items:center;flex-direction:column}.login-brand{text-align:center;color:#fff;margin:0 0 14px}.login-brand h1{margin:0;font-size:21px;letter-spacing:-1px;font-weight:800;text-shadow:0 2px 9px #10182855}.login-brand p{font-size:10px;color:#e0e5ed;margin:4px 0 0}.login-card{width:100%;background:#fff;border-radius:17px;padding:24px 28px 17px;box-shadow:0 18px 60px #10182855}.login-card h2{font-size:18px;margin:0 0 5px;letter-spacing:-.4px}.login-desc{margin:0 0 16px;color:#8b95a3;font-size:10px}.login-card form>label,.modal form>label{display:block;font-size:9px;font-weight:600;color:#414e5d;margin:11px 0 5px}.login-card label small{font-size:8px;color:#9ca5b1;font-weight:400}.field{height:39px;border:1px solid #e5eaf0;border-radius:8px;display:flex;align-items:center;gap:8px;padding:0 10px;background:#fff}.field:focus-within{border-color:#8cd7c0;box-shadow:0 0 0 3px #10a77e12}.field>i{font-style:normal;font-size:13px;color:#f29b38;min-width:14px;text-align:center}.field input{border:0;outline:0;background:transparent;min-width:0;flex:1;font-size:10px;color:#344052}.field input::placeholder{color:#b5bdc7}.field>button{border:0;background:none;color:#a2acb8}.remember{display:flex!important;align-items:center;gap:8px;margin:12px 0!important;color:#697585!important;font-size:9px!important;font-weight:500!important;cursor:pointer}.remember input{position:absolute;opacity:0}.remember>span{height:15px;width:15px;border:1px solid #ced6df;border-radius:4px;display:grid;place-items:center}.remember input:checked+span{background:#13a780;border-color:#13a780}.remember input:checked+span:after{content:"✓";font-size:10px;color:white}.enter-btn{height:41px;width:100%;border:0;border-radius:8px;background:#f39817;color:#fff;font-size:11px;font-weight:700;box-shadow:0 5px 12px #f398173d}.enter-btn:hover{background:#e88807;transform:translateY(-1px)}.or{height:24px;display:flex;align-items:center;gap:10px;color:#b3bbc5;font-size:8px}.or:before,.or:after{content:"";height:1px;flex:1;background:#edf0f3}.guest-btn{width:100%;height:36px;border:1px solid #e7ebef;border-radius:8px;background:#fff;color:#626e7d;font-size:9px;font-weight:600}.guest-btn:hover{background:#f7faf9;border-color:#bee8d8;color:#0d9571}.register-link{display:block;margin:10px auto 0;border:0;background:none;color:#159a76;font-size:9px;font-weight:600}.register-link b{font-size:13px;margin-left:4px}.login-error{min-height:0;color:#cf4f5a;font-size:9px;text-align:center;margin:5px 0 0}.login-footer{margin-top:12px;color:#e2e8ee;font-size:8px;text-shadow:0 1px 4px #11182766}.login-footer a{color:#fff;text-decoration:none}.modal-overlay{position:fixed;inset:0;background:#10182888;backdrop-filter:blur(3px);display:none;place-items:center;padding:16px;z-index:10}.modal-overlay.show{display:grid}.modal{width:min(370px,100%);background:#fff;border-radius:16px;padding:23px;position:relative;box-shadow:0 18px 60px #11182744}.modal .close{position:absolute;right:12px;top:11px;border:0;background:#f2f4f6;border-radius:50%;width:27px;height:27px;font-size:18px;color:#7e8997}.modal h2{font-size:16px;margin:5px 0}.modal>p{font-size:9px;color:#8e98a5;margin:0 0 14px}.modal-primary{margin-top:13px;height:39px;width:100%;background:#13a780;border:0;border-radius:8px;color:white;font-weight:700;font-size:10px}.modal-note{display:block;font-size:8px;line-height:1.5;margin-top:9px;color:#99a2ad}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:20;background:#172235;color:#fff;border-radius:9px;padding:10px 15px;font-size:10px;box-shadow:0 8px 24px #11182733;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}.mobile-only,.mobile-nav{display:none}
.dark-mode{--line:#2c3544;--panel:#1c2533;background:#141b27;color:#e5eaf2}.dark-mode .layout,.dark-mode body{background:#141b27}.dark-mode .left-rail,.dark-mode .chat-panel,.dark-mode .right-panel,.dark-mode .composer,.dark-mode .login-card,.dark-mode .modal{background:#1c2533;color:#e5eaf2;border-color:#2c3544}.dark-mode .room:not(.active),.dark-mode .user-name,.dark-mode .msg-nick,.dark-mode .composer input,.dark-mode .login-card h2,.dark-mode .field input,.dark-mode .modal h2{color:#d8dfeb}.dark-mode .chat-heading,.dark-mode .group-label{border-color:#2c3544}.dark-mode .field input::placeholder,.dark-mode .composer input::placeholder{color:#8490a1}.dark-mode .login-card form>label,.dark-mode .modal form>label{color:#c7d0dc}.dark-mode .welcome-card{border-color:#3a4554}.dark-mode .welcome-card strong{color:#d4dce8}
@media(max-width:980px){.layout{grid-template-columns:185px minmax(0,1fr);padding:10px}.right-panel{display:none;border:1px solid var(--line);border-radius:0 13px 13px 0;position:absolute;right:10px;top:76px;bottom:10px;width:min(275px,80vw);z-index:4;box-shadow:0 12px 35px #16202c35}.right-panel.mobile-open{display:flex}.mobile-only{display:block}.chat-panel{border-radius:0 13px 13px 0}.left-rail{border-radius:13px 0 0 13px}}
@media(max-width:620px){body{min-height:460px}.topbar{height:55px;padding:0 12px;gap:6px}.brand{font-size:15px}.brand-mark{width:26px;height:26px;font-size:20px}.network-state{font-size:8px;gap:5px}.network-state b{padding:3px 6px}.top-actions{gap:1px}.profile-pill{padding:3px;border:0;background:transparent}.profile-pill>span:nth-child(2),.profile-pill>b{display:none}.layout{display:block;height:calc(100dvh - 101px);padding:0;background:var(--panel)}.left-rail{display:none}.chat-panel{height:100%;border:0;border-radius:0}.chat-heading{height:54px;padding:0 13px}.mobile-only{display:block}.connection-notice{height:25px}.message-list{padding:13px 12px}.chat-message{max-width:96%}.composer{margin:0 8px;min-height:44px}.composer-hint{height:21px;padding-top:5px}.right-panel{top:55px;right:0;bottom:46px;width:min(300px,88vw)}.mobile-nav{height:46px;display:flex;background:#fff;border-top:1px solid #e9edf2;justify-content:space-around;align-items:center;z-index:3}.mobile-nav button{height:42px;min-width:74px;border:0;background:transparent;color:#8994a2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:15px}.mobile-nav button small{font-size:8px}.mobile-nav button.selected{color:#12a47c;font-weight:700}.overlay{inset:55px 0 0;padding:12px;background:#101724a8}.login-brand{margin-bottom:9px}.login-brand h1{font-size:18px}.login-brand p{font-size:9px}.login-card{padding:19px 18px 14px;border-radius:14px}.login-card h2{font-size:16px}.login-desc{margin-bottom:11px}.login-card form>label{margin-top:8px}.field{height:36px}.remember{margin:9px 0!important}.enter-btn{height:38px}.login-footer{text-align:center;font-size:8px}.dark-mode .mobile-nav{background:#1c2533;border-color:#2c3544}}
@media(max-height:680px){.login-brand{margin-bottom:6px}.login-brand h1{font-size:17px}.login-brand p{margin-top:1px}.login-card{padding-top:15px;padding-bottom:10px}.login-card h2{font-size:15px}.login-desc{margin-bottom:8px}.login-card form>label{margin-top:6px}.field{height:34px}.remember{margin:7px 0!important}.enter-btn{height:35px}.or{height:19px}.guest-btn{height:32px}.login-footer{margin-top:7px}}

/* Reference-inspired desktop layout: chat, participants, then persistent channel list. */
@media (min-width: 900px) {
  .topbar { height: 58px; padding: 0 24px; }
  .layout { height: calc(100dvh - 58px); max-width: none; padding: 0; grid-template-columns: minmax(0, 1fr) minmax(170px, 18vw) minmax(180px, 18vw); }
  .chat-panel { grid-column: 1; grid-row: 1; border: 0; border-right: 1px solid var(--line); border-radius: 0; }
  .right-panel { grid-column: 2; grid-row: 1; position: static; width: auto; border: 0; border-right: 1px solid var(--line); border-radius: 0; }
  .left-rail { grid-column: 3; grid-row: 1; border: 0; border-left: 1px solid var(--line); border-radius: 0; padding: 19px 13px 12px; }
}
.room.status-room{margin-bottom:8px;border-bottom:1px solid #edf0f3;border-radius:8px}.room.status-room .hash{font-size:12px;color:#16a880}.room.status-room.active{background:#e9f8f2}.chat-tools{margin:0 17px 7px;padding:10px 12px;background:#fff;border:1px solid #e3e8ed;border-radius:12px;box-shadow:0 8px 24px #1b25321a;max-height:36vh;overflow:auto;flex:none}.chat-tools[hidden]{display:none}.tools-title{display:flex;justify-content:space-between;align-items:center;font-size:11px;margin-bottom:8px}.tools-title button{border:0;background:#f2f5f7;border-radius:6px;width:25px;height:25px}.emoji-grid{display:grid;grid-template-columns:repeat(12,minmax(26px,1fr));gap:3px}.emoji-grid button{border:0;border-radius:6px;background:transparent;font-size:18px;height:30px}.emoji-grid button:hover{background:#edf7f3}.format-tools{display:flex;align-items:center;gap:6px;flex-wrap:wrap;border-top:1px solid #edf0f3;margin-top:9px;padding-top:8px}.format-tools>button{height:27px;min-width:28px;border:1px solid #e4e9ed;border-radius:6px;background:#fff;color:#536071}.format-tools .color-label{font-size:9px;color:#7d8997;margin-left:6px}.color-grid{display:flex;gap:4px;flex-wrap:wrap}.color-grid button{width:18px;height:18px;border-radius:50%;border:1px solid #cbd2d9;background:var(--swatch)}.color-grid button.selected{outline:2px solid #12a47c;outline-offset:2px}.status-line{display:flex;justify-content:center;align-items:flex-start;gap:8px;max-width:100%;margin:4px auto 8px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;line-height:1.5;text-align:left;overflow-wrap:anywhere}.status-line time{flex:none;color:#96a0ad;font-size:9px;padding-top:2px}.status-line>span{display:block;max-width:min(920px,95%);white-space:pre-wrap;overflow-wrap:anywhere;border-radius:8px}.dark-mode .chat-tools{background:#1c2533;border-color:#2c3544}.dark-mode .tools-title,.dark-mode .format-tools>button{color:#d8dfeb;background:#1c2533;border-color:#3a4554}.dark-mode .room.status-room{border-color:#2c3544}
@media(max-width:620px){.chat-tools{margin:0 8px 6px;max-height:30vh;padding:8px}.emoji-grid{grid-template-columns:repeat(9,minmax(25px,1fr))}.emoji-grid button{height:28px;font-size:17px}.status-line{justify-content:flex-start;font-size:9px}.status-line>span{max-width:100%}}
.status-nav{width:calc(100% - 12px);margin:5px 6px 9px;padding:10px;border:1px solid #e7edf0;border-radius:9px;background:#fff;display:grid;grid-template-columns:20px 1fr;grid-template-rows:auto auto;gap:1px 7px;text-align:left;color:#566273}.status-nav>span{grid-row:1/3;align-self:center;color:#13a780}.status-nav>b{font-size:11px}.status-nav>small{font-size:8px;color:#9ba5b1}.status-nav.active{background:#e9f8f2;border-color:#c9ebdf;color:#078967}.dark-mode .status-nav{background:#1c2533;border-color:#2c3544;color:#d8dfeb}.dark-mode .status-nav.active{background:#18352d;border-color:#25634f}
.layout.status-view{grid-template-columns:minmax(0,1fr) 250px!important}.layout.status-view .left-rail{display:none!important}.layout.status-view .chat-panel{grid-column:1}.layout.status-view .right-panel{grid-column:2;border-left:1px solid var(--line);border-radius:0 14px 14px 0;display:flex!important;position:relative;right:auto;top:auto;bottom:auto;width:auto;box-shadow:none;padding:18px 12px 10px}.layout.status-view #channelPanel{display:flex;flex-direction:column;min-height:0;height:100%}.layout.status-view #channelPanel[hidden]{display:none}.layout.status-view #peopleContent[hidden]{display:none}.channel-heading{display:flex;justify-content:space-between;align-items:center;padding:14px 4px 10px;border-bottom:1px solid #edf0f3;font-size:9px;letter-spacing:.5px;color:#8591a0}.channel-heading>b{font-size:9px;border-radius:10px;background:#eef7f3;color:#149875;padding:4px 7px}.status-channel-list{overflow:auto;padding:7px 0}.status-channel{display:flex;align-items:center;gap:9px;width:100%;height:38px;padding:0 7px;border:0;border-radius:8px;background:transparent;text-align:left;color:#586577;font-size:11px}.status-channel:hover{background:#f5f8fa;color:#078967}.status-channel .hash{color:#9aa5b1;font-size:15px}.join-channel{height:35px;flex:none;margin-top:6px;border:1px solid #e7edf2;border-radius:8px;background:#fff;color:#667485;font-size:10px}.join-channel:hover{border-color:#b6e5d5;color:#078967}.dark-mode .status-channel:hover{background:#253244;color:#8de0c4}.dark-mode .channel-heading{border-color:#2c3544}.dark-mode .join-channel{background:#1c2533;border-color:#2c3544;color:#d8dfeb}
@media(max-width:620px){.layout.status-view{display:block}.layout.status-view .left-rail{display:none!important}.layout.status-view .right-panel{display:none!important}.layout.status-view .right-panel.mobile-open{display:flex!important;position:absolute;right:10px;top:62px;bottom:52px;width:min(290px,85vw);z-index:4;border-radius:13px;box-shadow:0 12px 35px #16202c35}.status-line{justify-content:flex-start}}
.layout:not(.status-view) .connection-notice{display:none}.status-line{justify-content:flex-start;margin:4px 8px 8px;text-align:left}.status-line>span{background:transparent;padding:0;border-radius:0;color:#53647a}.status-line time{min-width:47px}

.room-section-label{padding:14px 8px 4px;color:#99a2ae;font-size:8px;font-weight:700;letter-spacing:1px}.private-room .hash{font-size:14px;color:#b185d8}.private-room.active .hash{color:#078967}.user-rank{min-width:18px;text-align:right;white-space:nowrap;letter-spacing:.3px;font-size:11px;font-weight:800;color:#128b70}.user-rank:empty{display:none}.private-empty{margin:30px auto;padding:16px 20px;max-width:420px;border:1px dashed #dce4eb;border-radius:12px;color:#8b96a4;text-align:center;font-size:12px}