/* Append after the existing office, discussion, task and voice styles. */
/* Voice controls may exceed a short viewport: scroll the whole discussion,
   instead of clipping its fixed-height flex children. */
.vi1-room-discussion[open]{display:block;height:auto;max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain}
.vi1-room-discussion .discussion-replies{max-height:32dvh;min-height:0;overflow:auto}
#conversation{max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain}
#conversation .message,.vi1-staff-voice-settings p{overflow-wrap:anywhere}
.dialog-head>div,.dialog-head h2{min-width:0;overflow-wrap:anywhere}
.dialog-head>button{flex-shrink:0}
select:focus-visible,input:focus-visible{outline:3px solid #49896e;outline-offset:3px}
/* Two predictable rows for the five current action buttons; text may wrap. */
@media(max-width:700px){
 header{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:38px auto auto;gap:6px}
 header>.brand{grid-column:1;font-size:28px;line-height:1.2}
 header>span{grid-column:2/-1;min-width:0;overflow-wrap:anywhere}
 header button,#owner-access{min-width:0;min-height:44px;white-space:normal;line-height:1.2}
 aside{top:168px}
 .vi1-staff-voice-settings select,#conversation textarea,.vi1-room-discussion textarea{font-size:16px}
 .vi1-staff-voice-settings button,#conversation .dialog-head>button{min-height:44px}
}