.chat-layout{display:grid;grid-template-columns:245px minmax(0,1fr);gap:38px;padding-top:40px;padding-bottom:60px;max-width:1250px}.chat-sidebar h1{font:500 clamp(32px,4vw,49px)/1.2 var(--display);letter-spacing:-.05em;margin:22px 0}.chat-sidebar h1 span{color:#8553b0}.chat-sidebar>p,.room-note p{font:13px/1.9 var(--sans);color:#77717e}.room-current{display:flex;align-items:center;gap:9px;margin-top:30px;padding:17px 12px;border:1px solid #c7b5d8;border-radius:8px;background:linear-gradient(#fff,#e5dced);font:11px var(--mono);text-decoration:none;color:#654186;box-shadow:inset 0 1px white,0 3px 9px #72608012}.back-feed{display:block;margin:22px 12px;font:11px var(--mono)}.room-note{border-top:1px solid #d9d4dd;padding-top:22px;margin-top:30px}.room-note strong{font:10px var(--mono);letter-spacing:.1em}.chat-sticker{margin:32px 0;padding:25px 18px;border:1px solid #c7bdcf;border-radius:50%;text-align:center;transform:rotate(-9deg);background:radial-gradient(ellipse at 30% 20%,white,#e6dced 60%,#c6c0cd);font:600 18px/1.3 var(--display);color:#746080;text-shadow:0 1px white}.chat-sticker span{font-size:30px}.chat-window{position:relative;min-width:0;border:1px solid #bcb3c4;border-radius:13px;overflow:hidden;background:#fffdfd;box-shadow:0 15px 45px #77608116,inset 0 1px white}.window-chrome{display:flex;justify-content:space-between;gap:10px;padding:11px 18px;background:linear-gradient(#fff,#e8e6eb 42%,#d3cdd9 48%,#f2eff5);border-bottom:1px solid #c4bdcc;font:9px var(--mono);letter-spacing:.08em;color:#73677c}.room-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:26px 25px 22px}.room-header h2{font:500 clamp(15px,2vw,22px)/1.4 var(--display);margin:9px 0 0;letter-spacing:-.04em}.connection{font:10px var(--mono);color:#726580;white-space:nowrap}.connection[data-connected=true]{color:#4f805f}.chat-topic{font:10px/1.6 var(--mono);background:#f4eff8;border-block:1px solid #e9e0ef;padding:12px 25px;color:#82718f}.messages{height:390px;overflow:auto;overscroll-behavior:contain;padding:22px 25px;scrollbar-color:#cfbedc #f7f4fa}.chat-empty{text-align:center;color:#92829d;padding:100px 15px;font:13px/1.8 var(--sans)}.chat-message{display:grid;grid-template-columns:34px minmax(0,1fr);gap:11px;margin-bottom:21px}.chat-avatar{width:34px;height:34px;display:grid;place-items:center;border:1px solid #d2c3dd;border-radius:50%;background:linear-gradient(140deg,#fff,#e2d4ef);color:#8a61aa;font:12px var(--display)}.message-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;line-height:1.5}.message-meta strong{font:600 12px var(--sans);color:#685078}.message-meta time{font:9px var(--mono);color:#9a919f}.message-text{font:13px/1.7 var(--sans);margin:4px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;color:#554b5d}.delete-message{margin-left:auto;border:0;background:none;font:9px var(--mono);color:#8c7b99;cursor:pointer;padding:4px}.delete-message:hover{color:#a43b65}.chat-compose{border-top:1px solid #e4dce9;background:#faf8fc;padding:15px 23px 12px}.chat-compose>p:first-child{font:11px/1.6 var(--mono);color:#786086;margin:0 0 11px}.chat-compose a{color:#714594}.chat-compose textarea{display:block;resize:vertical;width:100%;box-sizing:border-box;min-height:75px;max-height:180px;background:#fff;border:1px solid #d5c8e0;border-radius:7px;padding:13px;font:13px/1.6 var(--sans);color:#554b5d}.compose-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:10px}.compose-bottom>span,.chat-footnote{font:9px/1.6 var(--mono);color:#97889f}.compose-bottom .download-button{padding:11px 25px;font-size:11px;min-height:39px}.chat-feedback{font:12px/1.5 var(--sans);color:#8d466e;margin:8px 0 0}.chat-footnote{margin:10px 0 0}.new-messages{position:absolute;bottom:240px;left:50%;transform:translateX(-50%);border:1px solid #bda3d0;border-radius:20px;background:#f3e9fc;padding:8px 15px;color:#74538c;font:11px var(--mono);cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}.chat-page :focus-visible{outline:2px solid #9d6abf;outline-offset:4px}@media(max-width:800px){.chat-layout{grid-template-columns:1fr;gap:20px;padding-top:22px}.chat-sidebar h1{font-size:30px;margin:12px 0}.chat-sidebar h1 br{display:none}.chat-sidebar>p{margin:0}.room-current{margin-top:15px}.room-note,.chat-sticker,.back-feed{display:none}.room-header{padding:19px 15px}.messages{padding:20px 15px;height:360px}.chat-topic{padding-inline:15px}.chat-compose{padding-inline:15px}.window-chrome{padding-inline:12px}.chat-page .nav{flex-wrap:wrap}.chat-page .header{gap:16px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.home-chat{margin:20px 0 28px}.home-chat .messages{height:240px}.home-chat .room-header{flex-wrap:wrap;padding:20px}.home-chat .room-header h2{font-size:17px}.home-chat .chat-compose{padding:14px 18px}.full-chat-link{margin-left:auto;font:10px var(--mono);color:#8553b0}.home-chat .connection{font-size:9px}@media(max-width:600px){.home-chat .room-header{gap:10px}.home-chat .room-header>div{width:100%}.home-chat .full-chat-link{margin-left:0}.home-chat .connection{margin-left:auto}.home-chat .messages{height:230px}}

.chat-avatar{overflow:hidden;flex-shrink:0}.chat-avatar img{display:block;width:100%;height:100%;object-fit:cover}.emoji-toggle{border:1px solid #c9b9d5;border-radius:7px;padding:9px 12px;background:linear-gradient(#fff,#e7dcef);color:#76518f;font:11px var(--mono);cursor:pointer}.compose-bottom{gap:12px}.compose-bottom #count{margin-right:auto}.emoji-panel:not([hidden]){display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;padding:10px;margin-top:10px;border:1px solid #d1c1de;border-radius:9px;background:linear-gradient(135deg,#fff,#f0e7f8);box-shadow:inset 0 1px white}.emoji-panel button{font:23px/1.2 "Segoe UI Emoji","Apple Color Emoji",sans-serif;padding:8px 2px;min-height:40px;border:1px solid transparent;border-radius:6px;background:transparent;cursor:pointer}.emoji-panel button:hover,.emoji-panel button:focus-visible{background:#e1ceee;border-color:#c8a8df}@media(max-width:440px){.emoji-panel:not([hidden]){grid-template-columns:repeat(6,minmax(0,1fr))}.emoji-toggle{padding:9px 8px}}

.emoji-panel:not([hidden]){width:280px;max-width:100%;box-sizing:border-box;grid-template-columns:repeat(8,minmax(0,1fr));gap:2px;padding:6px;max-height:150px;overflow-y:auto}.emoji-panel button{font-size:19px;padding:4px 1px;min-height:29px}.chat-avatar{text-decoration:none}.chat-avatar:hover{box-shadow:0 0 0 2px #b795d0}.chat-avatar:focus-visible{outline:2px solid #9d6abf;outline-offset:3px}@media(max-width:440px){.emoji-panel:not([hidden]){grid-template-columns:repeat(8,minmax(0,1fr))}}
