#kitchen-voice{flex:none;padding:0 14px 7px;position:relative;z-index:2;color:#f7e9c9;font-family:var(--sans)}
#kitchen-voice[hidden]{display:none}
.voice-bar{border:1px solid #c2a16b70;border-radius:12px;background:linear-gradient(115deg,#332f2aeF,#202c2ced);box-shadow:inset 0 1px #ffefc915,0 2px 8px #160f1226;padding:3px 5px 3px 11px}
.voice-top{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:48px}
.voice-copy{flex:1;min-width:0;line-height:1.35}
.voice-copy strong{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;letter-spacing:.3px}
.voice-copy small{display:block;font-size:10px;color:#d1c5ad;margin-top:3px;overflow-wrap:anywhere}
.voice-lamp{width:6px;height:6px;background:#978875;border-radius:50%;flex:none}
.voice-lamp.is-on{background:#a6d1a0;box-shadow:0 0 7px #a6d1a050}
.voice-controls{display:flex;align-items:center;gap:3px;flex:none}
.voice-button{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:6px;color:#f8e4b0;font-size:11px;line-height:1.2;background:#d5b66d10;border:1px solid #caaa6340;border-radius:9px;touch-action:manipulation}
.voice-button svg{width:19px;height:21px;flex:none}
.voice-button[data-action="voice-join"]{padding:6px 10px;border-color:#c6a36188;background:#ad8e4929}
.voice-button[aria-pressed="false"]{color:#c9b6a5;background:#bd79691c}
.voice-button[data-action="voice-leave"]{color:#ccbca5;background:transparent;border-color:transparent}
.voice-button:not(:disabled):active{background:#deba6550;transform:translateY(1px)}
.voice-roster{display:flex;align-items:center;gap:9px;min-width:0;overflow-x:auto;padding:0 2px 3px;scrollbar-width:thin}
.voice-person{display:inline-flex;align-items:center;gap:5px;max-width:120px;flex-shrink:0;color:#d2c6b0;font-size:10px;line-height:20px}
.voice-person>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;min-width:0}
.voice-person i{width:5px;height:5px;border-radius:50%;background:#82786a;flex:none}
.voice-person[data-speaking="true"]{color:#d7f0c1}
.voice-person[data-speaking="true"] i{background:#b5e194;box-shadow:0 0 0 3px #b5e19420}
.voice-roster .voice-button{margin-left:auto;min-height:44px;white-space:nowrap}
.voice-roster .voice-button:disabled{display:none}
.room-seat.voice-speaking .avatar,.fighter.voice-speaking .avatar{outline:2px solid #b5e194;outline-offset:3px;box-shadow:0 0 14px #b5e19470}
.fighter.voice-speaking .fighter-info{outline:1px solid #b5e194aa;box-shadow:0 0 12px #b5e19430}
@media(max-width:360px){#kitchen-voice{padding:0 8px 5px}.voice-bar{padding-left:8px}.voice-controls{gap:0}.voice-button{border-color:transparent}.voice-copy small{font-size:9px}.voice-copy strong{font-size:11px}}
@media(max-height:620px){#kitchen-voice{padding-bottom:3px}.voice-bar{border-radius:8px}.voice-top{min-height:44px}.voice-roster{padding-bottom:1px}.voice-person{line-height:16px}}
.voice-bar.has-translation{max-height:min(260px,34dvh);overflow-y:auto;scrollbar-width:thin}
.translation-panel{border-top:1px solid #cfb57833;margin-top:3px;padding:4px 3px 4px 0;min-width:0}
.translation-controls{display:flex;align-items:center;gap:4px;min-width:0}
.translation-controls>.translation-button{flex:1;min-width:0;min-height:44px;padding:5px 6px;font-size:10px;overflow-wrap:anywhere}
.translation-button[aria-pressed="true"]{background:#8cae7133;border-color:#a8ca8180;color:#e4f1cd}
.translation-status{display:flex;align-items:center;gap:6px;min-width:0;padding:3px 1px}
.translation-status>small{font-size:9px;color:#c8baa3;line-height:1.4;overflow-wrap:anywhere;flex:1}
.translation-status>.translation-button{flex:none;font-size:10px}
.translation-captions{min-width:0;overflow:hidden;display:block;margin-top:3px;white-space:nowrap}
.translation-caption{display:flex;align-items:baseline;gap:6px;padding:4px 7px;border-radius:7px;background:#111c1c69;border-left:2px solid #b39452;min-width:0;overflow:hidden;white-space:nowrap}
.translation-caption:not(:last-child){display:none}
.translation-caption>strong{display:block;flex:0 1 auto;min-width:0;max-width:22%;font-size:9px;font-weight:500;color:#c9b78c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#jiajiale-app .translation-caption p{display:block;flex:1 1 0;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px;line-height:1.35;color:#f3ead6;overflow-wrap:normal;margin:0}
.translation-caption p>span{display:inline-block;font-size:8px;color:#b8ccad;margin-right:6px;font-weight:700}
.translation-caption p[lang="en"]{color:#d6e4c8}
.translation-empty{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:10px;line-height:1.4;color:#b9aa93;padding:5px;margin:0}
@media(max-width:360px){.translation-controls{gap:2px}.translation-controls>.translation-button{padding:5px 3px;font-size:9px}}
@media(max-height:650px){.voice-bar.has-translation{max-height:30dvh}}
/* Compact, stateful communications. Hiding a panel does not stop its transports. */
.communication-bar{padding:0 8px;background:#1b2935ed;border-color:#bca36b66}
.communication-bar [hidden]{display:none!important}
.communication-summary{display:flex;align-items:center;gap:7px;min-width:0}
.communication-summary>.communication-toggle{flex:1;min-width:0;width:auto}
.voice-compact-action{display:flex;flex:none;align-items:center;padding:3px 0}
.voice-compact-action .voice-button{min-width:48px;min-height:44px;padding:6px 9px;font-size:11px;background:#d8b7741b;border-color:#d8b77455}
.communication-toggle{width:100%;display:flex;align-items:center;gap:8px;min-height:44px;color:#f7e6bc;background:none;border:0;padding:5px 2px;text-align:left;touch-action:manipulation}
.communication-toggle strong{font-size:12px;white-space:nowrap}
.communication-toggle small{font-size:10px;flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#bdc8cc}
.communication-panel{max-height:min(300px,42dvh);overflow-y:auto;overscroll-behavior:contain;border-top:1px solid #d4b97830;padding:6px 0}
.communication-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin-bottom:6px}
.communication-tabs .voice-button[aria-pressed=true]{background:#cdb0762b;border-color:#d3b67488;color:#ffe3a4}
.communication-panel .voice-bar{border:0;background:none;box-shadow:none;padding:0}
.voice-channel-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
.voice-channel-options .voice-button{min-width:0;font-size:12px}
.voice-channel-options .voice-button[aria-pressed=true]{color:#ffe7ae;border-color:#d6b36f99;background:#c4a2602b}
#jiajiale-app .voice-channel-note,.voice-channel-note{margin:5px 1px 3px;font-size:10px;line-height:1.45;color:#c8bea8}
.communication-bar .voice-button:disabled{opacity:.5;cursor:default}
.communication-bar .voice-button:focus-visible,.communication-toggle:focus-visible{outline:2px solid #f3d497;outline-offset:2px}
.communication-bar>.voice-roster{padding:0 1px 2px;gap:9px;max-height:24px}
.communication-bar>.voice-roster .voice-button{display:none}
.communication-bar .voice-copy small,.chat-status{font-size:10px;line-height:1.4}
.communication-bar .voice-top{flex-wrap:wrap}
.communication-bar .voice-copy{min-width:110px}
.communication-bar .translation-directions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.communication-bar .translation-directions .voice-button{min-width:0;font-size:11px}
.communication-chat{min-width:0}
.chat-messages{max-height:130px;overflow-y:auto;overscroll-behavior:contain;padding:3px 1px}
#jiajiale-app .chat-messages p{display:flex;gap:8px;font-size:12px;line-height:1.4;margin:0 0 7px;overflow-wrap:anywhere}
.chat-messages strong{flex:0 0 70px;max-width:70px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#dcc58f}
.chat-messages span{flex:1;min-width:0}
.chat-compose{display:flex;align-items:center;gap:6px}
.chat-compose input{min-width:0;flex:1;min-height:44px;border:1px solid #beaa7655;border-radius:8px;background:#0f1d29;color:#f8e8c8;padding:8px;font:inherit;font-size:12px}
.chat-compose .voice-button{flex:none;padding:8px 12px}
@media(prefers-reduced-motion:reduce){.communication-bar *{scroll-behavior:auto!important}}
.communication-bar[data-communication-expanded="true"]>.voice-roster{max-height:none}
.communication-bar[data-communication-expanded="true"]>.voice-roster .voice-button{display:inline-flex}
