/* 0.3.4 · A comfortable supporting workspace, never a narrow strip below the game.
 * Below-header docking on wide screens; overlay on notebooks; full pane on phones.
 * Pane geometry comes from syncSupportLayout(), including the software keyboard.
 */
.focus-shell{--support-width:440px;--support-top:58px;--support-height:calc(100dvh - 58px)}
.focus-shell>.adaptive-support.right-sidebar{
 display:flex;position:fixed;top:var(--support-top);right:0;bottom:auto;left:auto;
 width:var(--support-width);max-width:100%;height:var(--support-height);min-height:0;
 margin:0;padding:0;z-index:40;overflow:hidden;align-self:auto;
 background:#102a23;border-radius:0;box-shadow:-18px 0 52px #0005;
}
.focus-shell>.adaptive-support>.aside-panel{
 min-width:0;width:100%;height:100%;min-height:0;display:flex;flex-direction:column;
 border:0;border-left:1px solid #bdcbab40;border-radius:0;background:linear-gradient(170deg,#153129,#10261f);
 box-shadow:none;padding-bottom:env(safe-area-inset-bottom);
}
.focus-shell[data-support-layout="dock"]>.focus-body{
 width:calc(100% - var(--support-width));max-width:1800px;
 margin-left:0;margin-right:var(--support-width);padding-right:18px;
}
.focus-shell[data-support-layout="dock"]>.adaptive-support{box-shadow:-5px 0 30px #0002}
.focus-shell[data-support-layout="dock"] .table-members .seat{flex:0 1 139px}
.focus-shell[data-support-layout="dock"] .table-members .seat-you{display:none}
.focus-shell[data-support-layout="dock"] .table-members .seats{gap:7px}
.focus-shell[data-support-layout="dock"] .table-tool-actions{gap:4px}
.focus-shell[data-support-layout="dock"] .table-tool-actions>.btn{padding:6px 8px;font-size:11px}
.focus-shell[data-support-layout="dock"] .workspace-top .calendar-ribbon{grid-template-columns:118px minmax(0,1fr) 95px;gap:8px}
.focus-shell.physical-shell[data-support-layout="dock"] .workspace-top .calendar-ribbon{grid-template-columns:118px minmax(0,1fr)}
.focus-shell[data-support-layout="dock"] .calendar-ribbon .month .mon{font-size:10px;letter-spacing:.5px}
.focus-shell .support-backdrop{display:none}
.focus-shell[data-support-layout="overlay"]>.support-backdrop,
.focus-shell[data-support-layout="full"]>.support-backdrop{
 display:block;position:fixed;top:var(--support-top);left:0;right:0;bottom:auto;height:var(--support-height);
 z-index:39;padding:0;border:0;border-radius:0;background:#07171335;cursor:pointer;
}
.focus-shell .support-backdrop:active{transform:none}
.focus-shell>.adaptive-support .aside-head{padding:19px 22px 14px;min-height:82px;flex:0 0 auto;align-items:center;gap:12px;border-bottom:0}
.focus-shell>.adaptive-support .aside-head>div{min-width:0;flex:1}
.focus-shell>.adaptive-support .aside-head strong{font-size:22px;line-height:1.25;gap:9px;display:flex;align-items:center;color:#f0ead8}
.focus-shell>.adaptive-support .aside-head strong .icon{width:21px;height:21px;color:#d8bc7f}
.focus-shell>.adaptive-support .support-context{font-size:10px;letter-spacing:.6px;line-height:1.4;margin-bottom:7px;display:block;color:#adc5b0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.focus-shell>.adaptive-support .support-close{height:40px;min-height:40px;min-width:40px;width:auto;padding:8px;gap:6px;flex:0 0 auto;color:#d2dccc;border:1px solid #b7caab30;border-radius:9px}
.support-return-label{display:none}
.focus-shell>.adaptive-support .panel-tabs{flex:0 0 auto;padding:0 20px 12px;gap:6px;margin:0}
.focus-shell>.adaptive-support .panel-tabs button{min-height:42px;padding:8px 3px;font-size:12px;gap:5px;border-radius:7px;color:#b4cbb9}
.focus-shell>.adaptive-support .panel-tabs button .icon{width:15px;height:15px}
.focus-shell>.adaptive-support .panel-tabs button.on{color:#f0d498;background:#ddc28815;border-color:#d8bd7961;box-shadow:inset 0 -2px #d8bb77}
.focus-shell>.adaptive-support .support-chat-status{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 22px;flex:0 0 auto;border-top:1px solid #bdd2b526;border-bottom:1px solid #bdd2b526;background:#091e1740;color:#99b9a3;font-size:11px}
.focus-shell>.adaptive-support .support-chat-status .chat-state{padding:0;border:0;background:transparent;display:flex;gap:6px;align-items:center;font-size:11px;letter-spacing:.2px}
.focus-shell>.adaptive-support .support-chat-status .icon{width:14px;height:14px}
.focus-shell>.adaptive-support .chat-list{
 flex:1 1 0;min-height:0;max-height:none;height:auto;overflow-y:auto;overflow-x:hidden;
 padding:22px 22px 10px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#6f8c78 transparent;
}
.focus-shell>.adaptive-support .chat-item{display:flex;align-items:flex-start;gap:11px;margin-bottom:22px}
.focus-shell>.adaptive-support .chat-avatar{width:30px;height:30px;min-width:30px;font-size:14px;border-radius:9px}
.focus-shell>.adaptive-support .chat-avatar>.icon{width:16px;height:16px}
.focus-shell>.adaptive-support .chat-message-body{min-width:0;flex:1}
.focus-shell>.adaptive-support .chat-meta{gap:6px;flex-wrap:wrap;align-items:baseline;margin-bottom:5px}
.focus-shell>.adaptive-support .chat-meta strong{font-size:14px;color:#e0e8d8}
.focus-shell>.adaptive-support .chat-meta .sender-kind{font-size:8px;letter-spacing:.5px}
.focus-shell>.adaptive-support .chat-meta time{font-size:10px;margin-left:auto}
.focus-shell>.adaptive-support .chat-text{font-size:17px;line-height:1.58;color:#e0e7d9;overflow-wrap:anywhere;white-space:pre-wrap}
.focus-shell>.adaptive-support .suggestion-tag{font-size:11px;min-height:28px;padding:5px 8px;margin:0 0 7px;gap:7px}
.focus-shell>.adaptive-support .suggestion-tag b{font-size:15px}
.focus-shell>.adaptive-support .chat-empty{font-size:16px;line-height:1.6;color:#b3cbb6;padding:12px 0}
.focus-shell>.adaptive-support .typing-line{flex:0 0 auto;min-height:20px;padding:2px 22px;font-size:11px;line-height:16px}
.focus-shell>.adaptive-support .chat-controls{flex:0 0 auto;padding:12px 20px 8px;margin:0;border-top:1px solid #b5c6a528;background:#0b231c70}
.focus-shell>.adaptive-support .chat-controls textarea{font-size:16px;line-height:1.5;min-height:60px;max-height:100px;padding:10px 12px;background:#ffffff07;border-color:#b6c8ab45;resize:none}
.focus-shell>.adaptive-support .chat-compose-footer{margin-top:7px;padding-top:0;gap:10px;align-items:center}
.focus-shell>.adaptive-support .chat-compose-footer span{font-size:10px;line-height:1.4}
.focus-shell>.adaptive-support .chat-compose-footer>.btn{min-height:36px;min-width:44px;padding:7px 12px}
.focus-shell>.adaptive-support .chat-footnote{padding:0 20px 10px;min-height:24px;flex:0 0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px;background:#0b231c70}
.focus-shell>.adaptive-support .chat-footnote>span{font-size:9px;line-height:1.4;color:#9bb39f}
.focus-shell>.adaptive-support .chat-footnote .btn{font-size:10px;padding:3px 0;min-height:28px;color:#d8c591}
.focus-shell>.adaptive-support .chat-locked{flex:0 0 auto;font-size:14px;line-height:1.5;padding:15px 22px}
.focus-shell>.adaptive-support .chat-newer{flex:0 0 auto;align-self:center;font-size:12px;line-height:18px;min-height:31px;padding:5px 13px;color:#102a23;background:#dfc38a;border:1px solid #ebd4a3;border-radius:20px;box-shadow:0 3px 12px #0003;margin:0 0 4px}
.focus-shell>.adaptive-support .chat-newer[hidden],.focus-shell>.adaptive-support .support-live-tools[hidden]{display:none!important}
.focus-shell>.adaptive-support .support-live-tools{display:flex;align-items:center;gap:6px;flex:0 0 auto;padding:6px 20px;border-bottom:1px solid #8ba48e26}
.support-live-tools>span{margin-right:auto;font-size:11px;color:#aad4b5}
.focus-shell>.adaptive-support .support-live-tools .btn{min-height:32px;min-width:32px;padding:5px;font-size:11px}
.support-live-tools .btn.on{color:#e8d096;background:#dbc78b17}
.focus-shell>.adaptive-support .call-toolbar{flex:0 0 auto;padding:10px 20px}
.focus-shell>.adaptive-support .call-entry-buttons{gap:8px}
.focus-shell>.adaptive-support .call-entry-buttons>.btn{min-height:40px;font-size:12px}
.focus-shell>.adaptive-support .call-help{font-size:15px;line-height:1.6;padding:16px 22px;min-height:0;overflow:auto;flex:1}
.focus-shell>.adaptive-support .call-help h3{font-size:22px;margin:0 0 10px}
.focus-shell>.adaptive-support #call-slot:not(.media-keeper){flex:0 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain}
.focus-shell>.adaptive-support.call-only .in-call .video-grid{max-height:calc(var(--support-height) - 340px);grid-template-columns:1fr 1fr}
.focus-shell>.adaptive-support .diary-summary{padding:14px 22px;font-size:12px}
.focus-shell>.adaptive-support .diary-scroll{padding:0 22px}
.focus-shell>.adaptive-support .diary-scroll .log-entry-text{font-size:17px;line-height:1.58}
.focus-shell>.adaptive-support .diary-actions{padding:12px 20px 14px}
.focus-shell>.adaptive-support .calendar-scroll{padding:18px 22px}
.focus-shell[data-support-layout="full"]>.adaptive-support{width:100%;box-shadow:none}
.focus-shell[data-support-layout="full"]>.adaptive-support>.aside-panel{border-left:0}
.focus-shell[data-support-layout="full"] .support-return-label{display:inline;font-size:11px;line-height:1.3;max-width:68px;text-align:left}
/* A reduced-height window or virtual keyboard still leaves useful message space. */
@media(max-width:850px){
 .focus-shell>.adaptive-support .aside-head{padding:13px 16px 10px;min-height:72px;gap:8px}
 .focus-shell>.adaptive-support .aside-head strong{font-size:20px;gap:7px}
 .focus-shell>.adaptive-support .support-context{font-size:9px;margin-bottom:4px}
 .focus-shell>.adaptive-support .panel-tabs{padding:0 14px 10px;gap:5px}
 .focus-shell>.adaptive-support .panel-tabs button{min-height:42px;font-size:12px}
 .focus-shell>.adaptive-support .support-chat-status{padding:8px 17px}
 .focus-shell>.adaptive-support .chat-list{padding:18px 16px 8px}
 .focus-shell>.adaptive-support .chat-item{gap:9px;margin-bottom:20px}
 .focus-shell>.adaptive-support .chat-text{font-size:17px;line-height:1.55}
 .focus-shell>.adaptive-support .chat-controls{padding:10px 14px 7px}
 .focus-shell>.adaptive-support .chat-controls textarea{min-height:54px}
 .focus-shell>.adaptive-support .typing-line{padding-left:16px}
 .focus-shell>.adaptive-support .chat-footnote{padding:0 14px 9px;gap:3px}
 .focus-shell>.adaptive-support .chat-footnote>span{font-size:8px}
 .focus-shell>.adaptive-support .support-live-tools{padding:5px 14px}
}
@media(max-height:650px){
 .focus-shell>.adaptive-support .aside-head{min-height:60px;padding-top:9px;padding-bottom:8px}
 .focus-shell>.adaptive-support .panel-tabs{padding-bottom:7px}
 .focus-shell>.adaptive-support .panel-tabs button{min-height:36px}
 .focus-shell>.adaptive-support .support-chat-status{padding-top:6px;padding-bottom:6px}
 .focus-shell>.adaptive-support .chat-controls{padding-top:8px;padding-bottom:5px}
 .focus-shell>.adaptive-support .chat-controls textarea{min-height:48px;height:48px}
 .focus-shell>.adaptive-support .chat-footnote{padding-bottom:4px}
 .focus-shell>.adaptive-support .chat-footnote>span{display:none}
 .focus-shell>.adaptive-support .chat-compose-footer{margin-top:4px}
}
/* Keyboard mode is set by the actual visual viewport, not by a device guess. */
.focus-shell[data-support-keyboard="true"]>.adaptive-support .aside-head{min-height:48px;padding:7px 14px}
.focus-shell[data-support-keyboard="true"]>.adaptive-support .support-context{display:none}
.focus-shell[data-support-keyboard="true"]>.adaptive-support .panel-tabs{padding-bottom:6px}
.focus-shell[data-support-keyboard="true"]>.adaptive-support .panel-tabs button{min-height:32px;padding:5px 3px}
.focus-shell[data-support-keyboard="true"]>.adaptive-support .support-chat-status,
.focus-shell[data-support-keyboard="true"]>.adaptive-support .chat-footnote{display:none}
.focus-shell[data-support-keyboard="true"]>.adaptive-support .chat-controls{padding:6px 12px}
.focus-shell[data-support-keyboard="true"]>.adaptive-support .chat-controls textarea{height:44px;min-height:44px}
.focus-shell[data-support-keyboard="true"]>.adaptive-support .chat-compose-footer{margin-top:3px}
.focus-shell[data-support-keyboard="true"]>.adaptive-support .chat-compose-footer span{display:none}
.focus-shell[data-support-keyboard="true"]>.adaptive-support .chat-compose-footer>.btn{min-height:32px}
.focus-shell[data-support-keyboard="true"]>.adaptive-support .chat-list{padding-top:10px}
@media(prefers-reduced-motion:no-preference){
 .focus-shell>.adaptive-support.support-enter{animation:support-arrive .19s ease-out}
 .focus-shell>.support-backdrop.support-enter{animation:support-dim .19s ease-out}
 @keyframes support-arrive{from{transform:translateX(28px);opacity:.2}to{transform:translateX(0);opacity:1}}
 @keyframes support-dim{from{opacity:0}to{opacity:1}}
}

/* Give the conversation, rather than its chrome, most of the available height. */
.focus-shell>.adaptive-support .aside-head{min-height:72px;padding-top:14px;padding-bottom:11px}
.focus-shell>.adaptive-support .panel-tabs{padding-bottom:10px}
.focus-shell>.adaptive-support .support-chat-status{padding-top:8px;padding-bottom:8px}
.focus-shell>.adaptive-support .support-chat-status .chat-state{margin-left:0;margin-right:auto}
.focus-shell>.adaptive-support .chat-controls textarea{height:48px;min-height:48px;max-height:96px;overflow-y:auto;padding:10px 12px}
.focus-shell>.adaptive-support .chat-footnote>span{display:none}
.focus-shell>.adaptive-support .chat-footnote{min-height:0;padding-top:0;padding-bottom:6px}
@media(max-height:650px){.focus-shell>.adaptive-support .aside-head{min-height:60px;padding-top:9px;padding-bottom:8px}}
@media(max-width:850px){.focus-shell>.adaptive-support .aside-head{padding:12px 16px 10px;min-height:68px}}
@media(max-height:480px){
 .focus-shell>.adaptive-support .aside-head{min-height:48px;padding:7px 14px}
 .focus-shell>.adaptive-support .support-context{display:none}
 .focus-shell>.adaptive-support .aside-head strong{font-size:19px}
 .focus-shell>.adaptive-support .panel-tabs{padding:0 14px 6px;gap:5px}
 .focus-shell>.adaptive-support .panel-tabs button{min-height:32px;padding:5px 3px}
 .focus-shell>.adaptive-support .support-chat-status,.focus-shell>.adaptive-support .chat-footnote{display:none}
 .focus-shell>.adaptive-support .chat-controls{display:flex;gap:8px;align-items:flex-end;padding:8px 12px}
 .focus-shell>.adaptive-support .chat-controls textarea{flex:1;width:0;min-width:0;min-height:44px;max-height:64px}
 .focus-shell>.adaptive-support .chat-compose-footer{flex:0 0 auto;margin:0}
 .focus-shell>.adaptive-support .chat-compose-footer>span{display:none}
 .focus-shell>.adaptive-support .chat-compose-footer>.btn{min-height:44px}
 .focus-shell>.adaptive-support .chat-list{padding-top:10px}
 .focus-shell>.adaptive-support .typing-line{min-height:18px}
}
/* Scroll positions are controlled by the app, not browser anchoring heuristics. */
.focus-shell>.adaptive-support .chat-list,
.focus-shell>.adaptive-support .diary-scroll,
.focus-shell>.adaptive-support .calendar-scroll{overflow-anchor:none;scroll-behavior:auto}
