.room-shell{grid-template-columns:190px minmax(360px,1fr) minmax(350px,35vw)}
.room-presence{display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 50%,#f7e5c7,transparent 70%),#eee7d9;padding:26px 22px}
.presence-title h2{font-weight:500;font-size:17px}
.lounge-caption{font-size:12px;line-height:1.7;margin:0;color:#526454}
.lounge-tables{display:grid;grid-template-columns:1fr 1fr;gap:20px 4px;margin:auto 0;padding:24px 0}
.cafe-table{position:relative;margin:0;min-width:0}
.table-drawing{position:relative;width:100%;aspect-ratio:1.5;overflow:hidden}
.table-half{position:absolute;top:0;width:50%;height:100%;overflow:hidden}
.table-half.left{left:0}.table-half.right{right:0}
.table-half img{position:absolute;width:400%;max-width:none;height:200%;object-fit:fill;pointer-events:none}
.table-half.left img{left:calc(var(--col) * -200%);top:calc(var(--row) * -100%)}
.table-half.right img{left:calc(-100% - var(--col) * 200%);top:calc(var(--row) * -100%)}
.cafe-table figcaption{text-align:center;font-size:12px;line-height:1.7;margin-top:4px}
.cafe-table figcaption span{display:block;font-size:10px;letter-spacing:.08em;opacity:.65}
.cafe-table.mine:after{content:"내 테이블";position:absolute;top:0;left:50%;transform:translateX(-50%);font-size:10px;white-space:nowrap;color:#c94d44}
.coffee{position:absolute;z-index:2;top:59%;width:17px;height:15px;border:2px solid #403d32;border-radius:2px 3px 7px 6px;background:#fff5df;transform-origin:bottom center;animation:sip 10s ease-in-out infinite}
.coffee:after{content:"";position:absolute;right:-8px;top:1px;width:6px;height:7px;border:2px solid #403d32;border-left:0;border-radius:0 5px 5px 0}
.coffee:before{content:"";position:absolute;top:-16px;left:5px;width:5px;height:12px;border-left:1px solid #8a8170;border-radius:50%;animation:steam 3s ease-out infinite}
.coffee.first{left:33%;--sip-x:-10px}.coffee.second{right:29%;--sip-x:10px;animation-delay:-5s}
.cafe-table:nth-child(2) .coffee{animation-delay:-2s}.cafe-table:nth-child(3) .coffee{animation-delay:-6s}.cafe-table:nth-child(4) .coffee{animation-delay:-8s}
.lounge-tables.is-moving .table-half.right{animation:seat-change 1.25s ease-in-out}
.room-presence .demo-next{margin-top:18px;flex-shrink:0}
@keyframes sip{0%,55%,85%,100%{transform:translate(0,0) rotate(0)}65%,75%{transform:translate(var(--sip-x),-26px) rotate(-13deg)}}
@keyframes steam{from{transform:translateY(2px);opacity:0}35%{opacity:.6}to{transform:translateY(-12px);opacity:0}}
@keyframes seat-change{0%{opacity:1;transform:translateX(0)}45%{opacity:0;transform:translateX(40px)}55%{opacity:0;transform:translateX(-40px)}100%{opacity:1;transform:translateX(0)}}
@media(max-width:1100px){.room-route{display:none}.room-shell{grid-template-columns:minmax(340px,1fr) 350px}}
@media(max-width:900px){.room-shell{height:calc(100dvh - 58px);display:flex;flex-direction:column}.room-presence{order:-1;display:block;flex:none;padding:8px 14px;border-left:0;border-bottom:1px solid var(--rule)}.presence-title{align-items:center}.presence-title h2{font-size:12px;margin:0}.lounge-caption,.room-presence .demo-next{display:none}.lounge-tables{grid-template-columns:repeat(4,1fr);gap:4px;margin:0;padding:12px 0 0}.table-drawing{max-height:110px}.cafe-table figcaption{font-size:9px;margin:0}.cafe-table figcaption span{display:none}.cafe-table.mine:after{top:-9px;font-size:8px}.coffee{width:10px;height:10px;border-width:1px;top:59%}.coffee:after{width:4px;height:5px;right:-5px;border-width:1px}.coffee:before{height:8px;top:-10px}.conversation{flex:1;height:auto;min-height:0;width:100%}.stage-head{height:86px}.chat{min-height:0;padding:12px}.stage-card{padding:12px;margin-bottom:8px}.stage-card h3{font-size:18px}.composer{grid-template-columns:1fr auto}.composer input{min-width:0}}
@media(prefers-reduced-motion:reduce){.coffee,.coffee:before,.lounge-tables.is-moving .table-half.right{animation:none}}
