.dialog-layout{display:grid;grid-template-columns:27% minmax(0,1fr);gap:18px;margin:20px 0 26px}.dialog-sidebar{display:flex;flex-direction:column;gap:16px}.dialog-tabs{display:flex;gap:8px;flex-wrap:wrap}.dialog-tabs .active{background:white}.dialog-contacts{display:grid;gap:10px}.dialog-contact{display:flex;align-items:center;gap:14px;padding:14px;background:white;border:1px solid #e2e2e5;border-radius:22px;text-align:left;min-width:0}.dialog-contact.selected{box-shadow:inset 0 0 0 2px var(--blue)}.dialog-contact img,.dialog-heading>img{width:46px;height:46px;object-fit:cover;border-radius:50%}.dialog-contact span{min-width:0}.dialog-contact b{font-weight:500;font-size:18px}.dialog-contact small{display:block;color:#89858f;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}.dialog-empty{background:#ffffff9c;border-radius:20px;padding:20px;font-size:14px;line-height:1.7}.dialog-paper{padding:18px;min-height:640px;display:flex;flex-direction:column}.dialog-heading{display:flex;align-items:center;flex-wrap:wrap;gap:10px;border-bottom:1px solid #eee;padding-bottom:12px}.dialog-heading h1{font-size:20px;margin-right:auto}.dialog-heading .outline{font-size:12px!important;padding:8px 10px!important}.dialog-messages{height:560px;overflow:auto;display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:22px 0;scrollbar-color:var(--blue) #eee;scrollbar-width:thin}.dialog-bubble{background:#efefef;border-radius:24px 24px 24px 0;padding:16px 20px;max-width:85%;overflow-wrap:anywhere;white-space:pre-wrap;line-height:1.5;font-size:18px}.dialog-bubble.mine{background:var(--blue);color:white;align-self:flex-end;border-radius:24px 24px 0 24px}.dialog-bubble.blocked{background:#f4e6e6;color:#922f3b}.dialog-bubble small{display:block;font-size:12px;margin-top:8px}.dialog-composer{display:flex;gap:12px;padding:12px;margin:12px 0}.dialog-composer input{flex:1;min-width:0;border:0;background:#f0f0f0;border-radius:22px;padding:12px 16px}.dialog-composer .primary{font-size:28px;border-radius:14px;min-width:42px;padding:4px 12px}.dialog-placeholder{align-items:center;justify-content:center;gap:20px;text-align:center}.dialog-placeholder h1{font-size:26px}.dialog-content> .outline{font-size:12px!important;padding:8px 12px!important}.ranking-toolbar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:20px 0;color:#6e6a7c;font-size:12px}.ranking-toolbar .outline{background:white;border:1px solid #ddd;border-radius:20px;padding:10px 16px}.ranking-list{display:grid;gap:18px;margin:24px 0}.ranking-row{display:flex;gap:16px;align-items:center;padding:20px 18px;min-height:102px}.rank-position{display:grid;place-items:center;width:38px;min-width:38px;height:54px;border-radius:25px;border:1px solid #eee;box-shadow:var(--shadow);font-size:20px;color:#111}.rank-avatar{padding:0;background:none;flex-shrink:0}.rank-avatar img{display:block;width:54px;height:54px;object-fit:cover;border-radius:50%}.rank-info{flex:1;min-width:0}.rank-name{padding:0;background:none;text-align:left;font-size:24px;overflow-wrap:anywhere}.rank-stats{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:8px;color:#888;font-size:16px}.rank-stats b{color:#111}.rank-view{width:64px;height:56px;flex-shrink:0;border-radius:20px;background:white;border:1px solid #eee;box-shadow:var(--shadow);display:grid;place-items:center}.rank-view img{width:32px;height:32px;object-fit:contain}.ranking-row.self .rank-position{color:var(--blue)}
@media(max-width:1000px){.dialog-layout{grid-template-columns:220px minmax(0,1fr)}.rank-stats{font-size:14px}.rank-name{font-size:21px}.ranking-row{gap:12px}.dialog-contact small{max-width:128px}}
@media(max-width:600px){.dialog-layout{grid-template-columns:1fr}.dialog-contacts{display:flex;overflow-x:auto;padding-bottom:5px}.dialog-contact{min-width:200px;max-width:250px}.dialog-sidebar>.outline{align-self:flex-start}.dialog-paper{min-height:320px;padding:14px}.dialog-messages{height:300px}.dialog-bubble{font-size:16px;max-width:92%}.dialog-heading h1{font-size:18px}.ranking-row{padding:16px 12px;gap:10px;align-items:flex-start}.rank-position{min-width:28px;width:28px;height:40px;font-size:16px}.rank-avatar img{width:42px;height:42px}.rank-name{font-size:18px}.rank-stats{font-size:12px;gap:6px}.rank-view{width:34px;height:38px;border-radius:12px}.rank-view img{width:23px;height:23px}.ranking-toolbar{align-items:flex-start}.ranking-toolbar span{max-width:55%;line-height:1.6}.ranking-list{gap:12px}.dialog-placeholder p{line-height:1.6}}

#likes-room .dialog-tabs .outline{background:white;border-color:#e2e2e5;font-size:14px;padding:10px 14px}#game-room:has(.chat-panel){max-width:none;padding-top:20px}#game-room .chat-panel{grid-template-columns:27% minmax(0,1fr);background:transparent;border:0;box-shadow:none;padding:0;gap:18px}#game-room .chat-sidebar{grid-column:1;grid-row:1}#game-room .chat-conversation{grid-column:2;grid-row:1;background:white;border:1px solid #e2e2e5;border-radius:24px;padding:18px}#game-room .chat-title{flex-wrap:wrap;padding:0 0 14px}#game-room .chat-messages{box-shadow:none;border:0;border-radius:0;height:560px;padding:16px 0}#game-room .chat-message{font-size:18px;padding:16px 20px;border-radius:24px 24px 24px 0}#game-room .chat-message.mine{border-radius:24px 24px 0 24px;background:var(--blue)}#game-room .chat-tabs button{background:white;border:1px solid #ddd;border-radius:24px;padding:10px 16px}#game-room .chat-tabs button.active{border-color:var(--blue)}#game-room #chat-input{background:#f0f0f0;border:0}#game-room .chat-contact{font-size:18px;padding:14px}#game-room .chat-contact small{font-size:12px}
@media(max-width:1000px){#game-room .chat-panel{grid-template-columns:220px minmax(0,1fr)}}@media(max-width:600px){#game-room .chat-panel{grid-template-columns:1fr}#game-room .chat-sidebar{grid-column:1;grid-row:1}#game-room .chat-conversation{grid-column:1;grid-row:2}#game-room .chat-contact{font-size:14px}#game-room .chat-message{font-size:16px}#game-room .chat-title{gap:8px}}

@media(max-width:600px){#game-room .chat-messages{height:300px}}
