/* Self-contained overlays and inline sprites; the table keeps its existing height. */
.social-dialog [hidden],.social-chat-toggle[hidden]{display:none!important}
.topbar nav .social-chat-toggle,.at-table .topbar nav .social-chat-toggle{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;border:1px solid #ddb06b66;border-radius:13px;background:linear-gradient(145deg,#435b3b,#223e30);color:#ffe4ab;box-shadow:inset 0 1px 0 #fff2,0 3px 0 #101e17;touch-action:manipulation}
.topbar nav .social-chat-toggle:hover{background:linear-gradient(145deg,#536a43,#2b4b37)}
.topbar .social-chat-toggle .social-unread{position:absolute;top:-5px;right:-5px;display:grid;place-items:center;min-width:19px;width:auto;height:19px;margin:0;padding:0 4px;border:2px solid #1a3024;border-radius:20px;background:#ffd076;color:#233725;font:800 10px/1 var(--font,sans-serif);box-shadow:0 2px 5px #0004}
.social-avatar{position:relative;display:inline-grid;place-items:center;overflow:hidden;isolation:isolate;flex-shrink:0;border-radius:50%;background:linear-gradient(145deg,#f5d994,#bf9555);box-shadow:inset 0 0 0 1px #ffebbf80,0 2px 4px #071c1644;color:#314c31}
.social-avatar-sprite,.social-avatar-photo{display:block;width:100%;height:100%;border-radius:inherit;object-fit:cover;object-position:center}
.social-avatar-sprite{position:relative;background-repeat:no-repeat;background-size:300% 200%;background-position:var(--avatar-position,0% 0%)}
.social-avatars-ready .social-avatar-sprite{background-image:url('./avatar-atlas.png')}
.social-avatar-fallback{position:absolute;inset:0;display:grid;place-items:center;font-size:1em}
.social-avatars-ready .social-avatar-fallback{visibility:hidden}
.seat-card .social-avatar-button{border:1px solid #f7d99a9c;padding:0;cursor:pointer;overflow:visible}
.seat-card .social-avatar-button .social-avatar-sprite,.seat-card .social-avatar-button .social-avatar-photo{overflow:hidden}
.seat-card .social-avatar-button:hover{box-shadow:0 0 0 2px #ffd48e88}
.seat-card .social-avatar-button:focus-visible{outline:2px solid #ffe3a8;outline-offset:3px}
.social-sticker{position:relative;display:inline-block;flex-shrink:0;width:76px;height:76px;vertical-align:middle;background-repeat:no-repeat;background-size:300% 300%;background-position:var(--sticker-position,0% 0%);filter:drop-shadow(0 3px 1px #15251b33)}
.social-stickers-ready .social-sticker{background-image:url('./sticker-atlas.png')}
.social-sticker-fallback{position:absolute;inset:0;display:grid;place-items:center;font-size:46px;line-height:1}
.social-stickers-ready .social-sticker-fallback{visibility:hidden}
.social-dialog{--social-cream:#fff1ca;--social-muted:#c3d3b7;--social-line:#d1e0ba24;box-sizing:border-box;width:calc(100% - 24px);max-width:416px;max-height:calc(100dvh - 32px);padding:20px;border:1px solid #cba96e9c;border-radius:24px;background:linear-gradient(150deg,#3c5d3f,#1c3d31 58%,#17382d);color:var(--social-cream);font:14px/1.5 var(--font,-apple-system,BlinkMacSystemFont,sans-serif);box-shadow:inset 0 2px 0 #ffebba20,0 28px 100px #04150ac9;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a7b58650 transparent}
.social-dialog::backdrop{background:#04140db0;backdrop-filter:blur(6px)}
.social-dialog *{box-sizing:border-box}
.social-dialog button,.social-dialog input{font:inherit}
.social-dialog button{touch-action:manipulation}
.social-dialog button:focus-visible,.social-dialog input:focus-visible{outline:3px solid #ffdb89;outline-offset:3px}
.social-dialog button:disabled{opacity:.48;cursor:not-allowed}
.social-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none}
.social-eyebrow{display:block;font-size:11px;line-height:1.4;letter-spacing:1px;color:#b5c8a4}
.social-dialog .social-dialog-header h2{margin:3px 0 0;font-size:24px;font-weight:900;line-height:1.3;letter-spacing:.5px;color:#ffdda0;text-shadow:0 2px 0 #183321}
.social-close{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border:1px solid #c5d7ae3b;border-radius:50%;background:#172f2466;color:#ede8ce;font-size:27px!important;line-height:1}
.social-close:hover{background:#f9dfa014}
.social-profile-preview{display:flex;align-items:center;gap:16px;padding:18px 0}
.social-profile-avatar{width:76px;height:76px;font-size:50px;border:3px solid #eec783;box-shadow:0 4px 0 #193727,0 7px 20px #071d1433}
.social-profile-preview strong{font-size:17px;font-weight:800}
.social-profile-preview p{margin:4px 0 0;font-size:12px;color:var(--social-muted)}
.social-avatar-fieldset{min-width:0;border:0;padding:0;margin:18px 0 0}
.social-avatar-fieldset legend{padding:0;margin:0 0 10px;color:#e9e4c5;font-size:12px;font-weight:700}
.social-avatar-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.social-avatar-option{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 5px 8px;min-width:0;border:1px solid #acc39938;border-radius:14px;background:#112d2377;color:#dbe4c8;font-size:12px!important;box-shadow:inset 0 1px 0 #ffffff08}
.social-avatar-option .social-avatar{width:54px;height:54px;font-size:36px}
.social-avatar-option:hover{background:#57744760;border-color:#f5d49380}
.social-avatar-option[aria-pressed=true]{background:linear-gradient(145deg,#6d7940,#536333);border-color:#ffcf7e;box-shadow:0 0 0 1px #ffcf7e,inset 0 2px 0 #ffe7a429;color:#fff1c5}
.social-avatar-check{display:none;position:absolute;top:4px;right:5px;width:18px;height:18px;border-radius:50%;background:#ffcf7e;color:#3a4b27;font-size:12px;line-height:18px;font-weight:900}
.social-avatar-option[aria-pressed=true] .social-avatar-check{display:block}
.social-upload-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:0}
.social-soft-button{display:inline-flex;justify-content:center;align-items:center;gap:7px;min-height:40px;padding:8px 11px;border:1px solid #c7d4af45;border-radius:10px;background:#0f2d2255;color:#ecedcc;font-weight:600}
.social-soft-button:hover,.social-soft-button[aria-expanded=true]{background:#58734766;border-color:#e5c78377}
.social-text-button{padding:9px 0;border:0;background:none;color:#edc68b;font-size:12px!important}
.social-help{margin:9px 0 0;font-size:11px;color:var(--social-muted);line-height:1.6}
.social-help+.social-help{margin-top:2px}
.social-feedback{min-height:18px;margin:9px 0 0;color:#d1e5b6;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.social-feedback.is-error,.social-character-count.is-error{color:#ffc6a6}
.social-primary-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border:1px solid #ffe2a1;border-radius:12px;padding:10px 15px;background:linear-gradient(#ffdb92,#edb85e);color:#384527;font-weight:900!important;white-space:nowrap;box-shadow:inset 0 1px 0 #fff8,0 3px 0 #aa763a}
.social-primary-button:hover:not(:disabled){background:linear-gradient(#ffe8ae,#f2c674)}
.social-profile-dialog>.social-primary-button{width:100%;margin-top:10px}
.social-chat-dialog[open]{display:flex;flex-direction:column;gap:0;height:min(650px,calc(100dvh - 32px));overflow:hidden}
.social-chat-info{display:flex;align-items:center;justify-content:space-between;gap:7px;padding:12px 0 10px;flex:none}
.social-chat-info p{margin:0;color:var(--social-muted);font-size:11px;line-height:1.4}
.social-bubble-switch{display:flex;align-items:center;gap:5px;min-height:28px;flex:none;font-size:11px;color:#d9dfc2;cursor:pointer}
.social-bubble-switch input{width:15px;height:15px;margin:0;accent-color:#f0c578}
.social-messages{flex:1 1 0;min-height:80px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#afc09644 transparent;list-style:none;padding:13px 9px;margin:0;border:1px solid #a9c19325;border-radius:15px;background:#0d2a2077;scroll-padding-bottom:10px}
.social-message{display:flex;align-items:flex-start;gap:8px;margin:0 0 16px;min-width:0}
.social-message:last-child{margin-bottom:0}
.social-message-avatar{width:32px;height:32px;font-size:23px;border:1px solid #f3d39a77}
.social-message-content{display:flex;flex-direction:column;align-items:flex-start;min-width:0;max-width:calc(100% - 40px)}
.social-message-meta{display:flex;align-items:center;gap:5px;flex-wrap:wrap;min-height:20px;margin-bottom:4px;color:#cfddbd;font-size:10px;line-height:1.3}
.social-message-meta strong{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:600}
.social-message-meta time{font-size:9px;color:#96af94}
.social-person-tag{border-radius:4px;padding:1px 4px;background:#d5b7782b;color:#efd199;font-size:9px}
.social-person-tag.is-bot{background:#bbd6c019;color:#bfd4c1}
.social-message-body{padding:9px 11px;border:1px solid #bbd1a82c;border-radius:3px 12px 12px 12px;background:#3a5840;color:#f4efd9;font-size:13px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;box-shadow:0 2px 0 #081e1530}
.social-message-body.is-sticker{padding:0;border:0;background:transparent;box-shadow:none}
.social-message.is-mine{flex-direction:row-reverse}
.social-message.is-mine .social-message-content{align-items:flex-end}
.social-message.is-mine .social-message-meta{justify-content:flex-end}
.social-message.is-mine .social-message-body:not(.is-sticker){border-color:#d4b4746b;border-radius:12px 3px 12px 12px;background:linear-gradient(135deg,#d9c07c,#b3ac68);color:#263c29}
.social-chat-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%;padding:30px 18px;text-align:center;gap:8px;color:#bed0b3}
.social-chat-empty>span{font-size:37px;opacity:.8}
.social-chat-empty strong{font-size:15px;color:#e9dfb7}
.social-chat-empty p{font-size:12px;max-width:230px}
.social-chat-toolbar{display:flex;align-items:center;gap:7px;flex:none;padding:10px 0 8px}
.social-chat-toolbar .social-soft-button{min-height:36px;padding:6px 10px;font-size:12px;gap:5px}
.social-chat-toolbar .social-soft-button>span{font-size:18px;line-height:1}
.social-character-count{margin-left:auto;white-space:nowrap;color:#a9bf9e;font-size:10px;font-variant-numeric:tabular-nums}
.social-sticker-panel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;max-height:245px;flex:0 1 auto;overflow:auto;margin:0 0 10px;padding:6px;border:1px solid var(--social-line);border-radius:13px;background:#112d2288}
.social-sticker-panel button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:0;min-height:71px;padding:4px;border:1px solid transparent;border-radius:10px;background:transparent;color:#d6dfc2;font-size:10px}
.social-sticker-panel button:hover{background:#75915325;border-color:#d9c18455}
.social-sticker-panel .social-sticker{width:52px;height:52px}
.social-sticker-panel .social-sticker-fallback{font-size:37px}
.social-quick-panel{display:flex;flex-wrap:wrap;gap:7px;max-height:140px;flex:none;overflow:auto;margin-bottom:10px;padding:10px;border:1px solid var(--social-line);border-radius:13px;background:#112d2288}
.social-quick-panel button{min-height:36px;border:1px solid #b3cba342;border-radius:9px;padding:6px 10px;background:#345039;color:#e9e7c9;font-size:12px}
.social-quick-panel button:hover{border-color:#ffd28c99;background:#566b3e}
.social-composer{display:flex;align-items:stretch;gap:8px;flex:none;margin:0}
.social-composer input{min-width:0;flex:1;height:44px;padding:10px 12px;border:1px solid #b4c7984f;border-radius:12px;background:#112d228c;color:#fbf2d9;outline:none;font-size:16px}
.social-composer input::placeholder{color:#a4b99b;font-size:13px}
.social-composer .social-primary-button{min-width:62px;padding:10px 12px;font-size:13px}
.social-chat-dialog>.social-feedback{flex:none;margin-top:8px;min-height:18px}
.social-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Anchored above the seat card so the called quantity below the cup stays visible. */
.seat .seat-social-bubble{position:absolute;z-index:6;left:50%;bottom:calc(100% + 5px);transform:translateX(-50%);display:block;width:max-content;max-width:118px;max-height:42px;padding:5px 8px;border:1px solid #f5d28d;border-radius:11px 11px 11px 3px;background:#fff0be;color:#33452c;font-size:11px;font-weight:700;line-height:1.4;overflow:hidden;overflow-wrap:anywhere;pointer-events:none;box-shadow:0 3px 8px #071b1744;animation:social-bubble-in .18s ease-out}
.seat .seat-social-bubble.is-sticker{width:48px;height:48px;max-width:none;max-height:none;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.seat-social-bubble .social-sticker{width:48px;height:48px;filter:drop-shadow(0 2px 1px #102d1a66)}
.seat-social-bubble .social-sticker-fallback{font-size:34px}
.seat:nth-child(2) .seat-social-bubble,.seat:nth-child(3) .seat-social-bubble{left:0;transform:none}
.seat:nth-child(5) .seat-social-bubble,.seat:nth-child(6) .seat-social-bubble{left:auto;right:0;transform:none}
.at-table .seat:nth-child(3) .seat-social-bubble,.at-table .seat:nth-child(4) .seat-social-bubble,.at-table .seat:nth-child(5) .seat-social-bubble{bottom:auto;top:0;max-height:34px;padding-top:3px;padding-bottom:3px}
.at-table .seat:nth-child(3) .seat-social-bubble.is-sticker,.at-table .seat:nth-child(4) .seat-social-bubble.is-sticker,.at-table .seat:nth-child(5) .seat-social-bubble.is-sticker{width:34px;height:34px;padding:0}
.at-table .seat:nth-child(3) .seat-social-bubble .social-sticker,.at-table .seat:nth-child(4) .seat-social-bubble .social-sticker,.at-table .seat:nth-child(5) .seat-social-bubble .social-sticker{width:34px;height:34px}
@keyframes social-bubble-in{from{opacity:0;translate:0 5px;scale:.9}to{opacity:1;translate:0 0;scale:1}}
@media(max-width:480px){
  .social-dialog{padding:17px;border-radius:22px;max-height:calc(100dvh - 20px)}
  .social-chat-dialog{margin:auto auto 10px}
  .social-chat-dialog[open]{height:min(610px,calc(100dvh - 20px))}
  .social-dialog .social-dialog-header h2{font-size:22px}
  .social-profile-preview{padding:15px 0}.social-profile-avatar{width:68px;height:68px}
  .social-avatar-option{padding:8px 4px 6px}.social-avatar-option .social-avatar{width:48px;height:48px}
  .social-message-meta strong{max-width:100px}
}
@media(max-width:350px){
  .social-dialog{width:calc(100% - 16px);padding:14px;border-radius:18px}
  .social-chat-dialog{margin-bottom:8px}.social-chat-info{align-items:flex-start;gap:5px}.social-chat-info p{max-width:155px}
  .social-chat-toolbar{gap:5px}.social-chat-toolbar .social-soft-button{padding:6px 7px;font-size:11px}
  .social-avatar-options{gap:7px}.social-avatar-option .social-avatar{width:44px;height:44px}
  .social-upload-row .social-soft-button{font-size:12px;padding:8px}
  .social-sticker-panel .social-sticker{width:44px;height:44px}.social-sticker-panel button{min-height:63px}
  .social-message-body{padding:8px 9px}.social-message-meta strong{max-width:84px}
  .seat .seat-social-bubble{max-width:98px;font-size:10px;padding:4px 6px}
}
@media(max-height:530px){
  .social-dialog{max-height:calc(100dvh - 16px)}.social-chat-dialog[open]{height:calc(100dvh - 16px)}
  .social-chat-info{padding:5px 0}.social-chat-toolbar{padding:5px 0}.social-sticker-panel{max-height:120px}
  .social-chat-dialog .social-eyebrow{display:none}.social-chat-dialog .social-dialog-header h2{font-size:19px}
}
@media(prefers-reduced-motion:reduce){.seat .seat-social-bubble{animation:none}.social-dialog *,.social-chat-toggle{transition:none}}

/* A nickname belongs with the avatar, in the same compact profile flow. */
.social-name-label{display:block;margin:12px 0 7px;font-size:13px;font-weight:700;color:#dcddf3}
.social-dialog .social-name-input{box-sizing:border-box;width:100%;min-height:44px;border:1px solid #716789;border-radius:12px;padding:10px 13px;font:inherit;font-size:16px;color:#f2edff;background:#111528;outline:none}
.social-name-input:focus{border-color:#88edf1;box-shadow:0 0 0 3px #88edf126}
.social-profile-dialog .social-close[hidden]{display:none}
