/* Egytag Chat / readable classic UI refinements (2026-11-01).
   Small, targeted layer over the existing graphite design. */
:root{--bg:#161a1f;--base:#1d2229;--panel:#22272f;--panel-2:#2b323c;--line:#39424d;--muted:#a7b3c2}
.topbar{height:70px;padding-inline:25px;gap:24px}
.brand{min-width:250px}.brand-icon{height:43px;width:43px;border-color:#758297;background:#384452}
.brand strong{font-size:21px}.brand small{font-size:12px;line-height:1.4;margin-top:0}
.global-state{font-size:13px}.site-link{font-size:13px}.user-pill{font-size:14px;padding:9px 14px}
.workspace{grid-template-columns:minmax(250px,278px) minmax(0,1fr) minmax(235px,265px)}
.rooms-panel,.users-panel{padding:23px 16px}
.panel-head{margin-bottom:20px}.panel-head h2{font-size:19px;line-height:1.5}
.eyebrow{font-size:10px;letter-spacing:1.2px}.square{height:38px;width:38px}
.room-search{height:44px;margin-bottom:22px}.room-search input{font-size:14px}
.category-title{font-size:13px;margin:10px 0 12px;padding-inline:10px}
.room-list{gap:5px;margin-bottom:21px}
.room-item{padding:12px;min-height:67px;border-radius:11px;gap:11px}
.room-item .hash{font-size:23px;width:25px}
.room-item b{font-size:15px;line-height:1.55}
.room-item small{font-size:12px;line-height:1.55}
.live-count{font-size:12px}.live-count:before{height:7px;width:7px}
.sidebar-bottom{font-size:12px;padding-top:16px}.side-hint{font-size:11px}
.room-toolbar{height:83px;padding-inline:24px}
.room-meta h1{font-size:21px}.room-meta p{font-size:13px;line-height:1.5}
.room-hash{height:47px;width:47px;font-size:25px}
.room-count{font-size:13px}.text-button{font-size:14px;padding:9px 12px}
.room-tabs{min-height:47px;padding:8px 21px}
.room-tab{font-size:13px;padding:7px 13px}.tab-unread{font-size:11px}
.conversation{padding:24px 27px 18px}
.day-line{font-size:12px;margin:14px 0 22px;color:#95a4b5}
.message{gap:12px;margin-bottom:17px}
.avatar{height:37px;width:37px;font-size:15px;border-radius:10px}
.message-head{gap:12px;align-items:center}
.message-name{font-size:15px}.message-time{font-size:12px;color:#91a0b2}
.message-body{font-size:16px;line-height:1.75;color:#f0f2f7;margin-top:3px}
.message-system{font-size:13px}.loading-state{font-size:15px}
.typing{min-height:22px;font-size:12px;padding-inline:27px}
.composer{margin:0 22px 14px;border-radius:13px}
.composer-main textarea{min-height:55px;padding:12px 16px;font-size:15px;line-height:1.7}
.composer-tools{padding:8px 12px;gap:13px}
.input-tools button{font-size:24px;width:38px;height:37px}
.composer-tip{font-size:12px}.send-button{font-size:14px;padding:10px 21px}
.users-note{font-size:12px;line-height:1.8;margin-bottom:20px}
.user{font-size:14px;padding:11px 7px}.user .avatar{width:36px;height:36px;font-size:14px}
.user-info small{font-size:12px}.users-bottom{font-size:11px}
.footer{height:38px;font-size:11px}.footer-version{font-size:10px}
.view-switch button{font-size:12px;padding:5px 10px}
.dialog label{font-size:14px}.dialog p{font-size:15px}.dialog input,.dialog textarea{font-size:15px}
.toast{font-size:14px}
.room-intro{margin:8px 0 26px;padding:23px 24px;border:1px solid #485463;border-radius:15px;background:linear-gradient(125deg,#2f3945 0%,#28303a 65%,#252c34 100%);max-width:750px}
.room-intro.compact{padding:17px 20px;margin:2px 0 21px}
.room-intro .intro-kicker{font-size:12px;letter-spacing:.25px;color:#8cd6ba;display:flex;align-items:center;gap:8px}
.room-intro .intro-kicker::before{content:'';width:7px;height:7px;border-radius:50%;background:#74d9ad}
.room-intro h2{font-size:21px;line-height:1.5;margin:7px 0 3px}
.room-intro p{font-size:14px;line-height:1.9;color:#bfccdc;margin:0 0 14px}
.room-intro.compact h2{font-size:18px;margin:4px 0 1px}
.room-intro.compact p{font-size:13px}
.intro-actions{display:flex;gap:9px;flex-wrap:wrap}
.intro-actions button{border-radius:9px;border:1px solid #59687a;padding:8px 13px;font-size:13px;background:#3a4553;color:#f7faff}
.intro-actions button.primary{color:#1d2934;background:#d7e6f4;border-color:#d7e6f4;font-weight:800}
.intro-actions button:hover{filter:brightness(1.1)}
.mobile-new-room{display:none;background:#354355;border:1px solid #697b92;border-radius:9px;color:#fff;font-size:14px;padding:6px 11px;font-weight:700}
@media(max-width:1100px){
  .workspace{grid-template-columns:220px minmax(0,1fr) 208px}
  .rooms-panel,.users-panel{padding:17px 11px}
  .room-item b{font-size:14px}.room-item small{font-size:11px}
  .room-toolbar{padding-inline:14px}.room-meta h1{font-size:18px}
  .text-button{font-size:13px;padding:7px 9px}
  .conversation{padding:18px}.composer{margin-inline:12px}
}
@media(max-width:820px){
  .workspace{grid-template-columns:minmax(185px,213px) minmax(0,1fr)}
  .users-panel.show{top:70px;bottom:38px;width:255px}
}
@media(max-width:590px){
  .topbar{height:60px;padding-inline:11px;gap:8px}
  .brand{min-width:auto;gap:8px}.brand-icon{width:34px;height:34px}
  .brand strong{font-size:17px}.brand small{font-size:9px}
  .global-state{margin-right:auto}
  .user-pill{font-size:12px;padding:7px 8px}
  .mobile-new-room{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}
  .rooms-panel{max-height:125px;padding:7px 9px}
  .room-list .room-item{min-height:52px;padding:8px 11px}
  .room-item b{font-size:13px}
  .room-toolbar{height:66px}.room-meta h1{font-size:16px}.room-meta p{font-size:11px}
  .room-hash{width:35px;height:35px;font-size:20px}
  .toolbar-actions button{font-size:18px}
  .room-tabs{min-height:41px}.room-tab{font-size:12px}
  .conversation{padding:14px 12px 10px}
  .message{margin-bottom:14px;gap:9px}
  .avatar{width:32px;height:32px;font-size:13px}
  .message-body{font-size:14px;line-height:1.7}.message-name{font-size:13px}.message-time{font-size:11px}
  .typing{padding-inline:12px}
  .composer{margin:0 8px 8px}
  .composer-main textarea{font-size:14px;min-height:48px;padding:10px}
  .composer-tools{padding:5px 8px}
  .input-tools button{height:34px;width:34px;font-size:22px}
  .send-button{font-size:13px;padding:8px 12px}
  .room-intro,.room-intro.compact{padding:15px 15px;margin:2px 0 16px}
  .room-intro h2{font-size:18px}.room-intro p{font-size:13px}
  .room-intro.compact h2{font-size:16px}
  .intro-actions button{font-size:12px;padding:7px 10px}
  .footer{height:34px;font-size:10px}
  .view-switch button{font-size:11px;padding:4px 7px}
  .users-panel.show{top:60px;bottom:34px}
}
@media(max-width:380px){
  .brand small{display:none}
  .mobile-new-room{font-size:12px;padding:6px 7px}
  .user-pill{max-width:85px;overflow:hidden;text-overflow:ellipsis}
  .room-meta p{display:none}
}
@media(max-width:590px){.brand strong{white-space:nowrap;font-size:15px}.brand small{display:none}.user-pill{max-width:105px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}