/* Task63: visible viewport, touch controls, install support. */
:root { --app-height: 100dvh; --portal-header-height: 72px; }
.app-install { min-height:44px; padding:8px 12px; border:1px solid currentColor; border-radius:8px; background:transparent; color:inherit; font:inherit; cursor:pointer; }
.app-install[hidden] { display:none; }
.chat__messages,.chat-messages { min-height:0; }
.chat__header,.chat__form,.composer,.conversation-header { flex-shrink:0; }
.selected-image { overflow-wrap:anywhere; }
@media(max-width:820px), (max-width:1100px) and (pointer:coarse) {
 .portal { position:absolute; top:var(--app-top,0px); left:0; right:0; width:100%; height:var(--app-height); min-height:0; display:flex; flex-direction:column; overflow:hidden; }
 .portal[hidden] { display:none; }
 .topbar { height:auto; min-height:72px; flex-shrink:0; flex-wrap:wrap; padding-top:max(8px,env(safe-area-inset-top)); padding-bottom:8px; }
 .topbar-actions { flex-wrap:wrap; margin-left:auto; }
 .workspace { flex:1; min-height:0; }
 .conversation-panel { height:100%; min-height:0; }
 .case-sidebar { width:min(88vw,340px); left:0; z-index:15; transform:translateX(-105%); position:absolute; top:var(--portal-header-height); bottom:auto; height:calc(var(--app-height) - var(--portal-header-height)); }
 .case-sidebar.open { transform:translateX(0); }
 .mobile-only { display:inline-grid; place-items:center; }
 .workspace { display:block; }
 .conversation-header { min-height:0; padding:10px 14px; }
 .conversation-header h1 { margin:4px 0; }
 .conversation-meta { max-width:100%; white-space:normal; overflow-wrap:anywhere; }
 .chat-messages { padding:12px 14px; overscroll-behavior:contain; }
 .composer { padding-left:max(12px,env(safe-area-inset-left)); padding-right:max(12px,env(safe-area-inset-right)); }
 input,textarea,select { font-size:16px; }
 .language-picker select,.icon-button,.ghost-button,.filter-button { min-height:44px; }
 .login-layout { min-height:var(--app-height); padding-top:max(12px,env(safe-area-inset-top)); padding-bottom:max(12px,env(safe-area-inset-bottom)); }
}
@media(max-width:820px), (max-width:1100px) and (pointer:coarse) {
 body:has(.chat) { padding:0; overflow:hidden; }
 .chat { position:absolute; top:var(--app-top,0px); left:0; right:0; width:100%; height:var(--app-height); min-height:0; margin:0; border-radius:0; box-sizing:border-box; }
 .chat__header { padding-top:max(8px,env(safe-area-inset-top)); padding-bottom:8px; gap:8px; }
 .chat__header h1 { font-size:16px; }
 .chat__mark--wordmark { width:85px; height:28px; }
 .chat__header .language-picker { margin-left:auto; }
 .chat__messages { padding:12px; }
 .chat__feedback { flex-shrink:0; max-height:24dvh; overflow:auto; }
 .chat__feedback-note textarea { font-size:16px; }
 .chat__form textarea { resize:none; min-height:48px; max-height:90px; }
 .chat__actions { align-items:center; gap:8px; }
 .chat__portal-link { min-width:0; overflow-wrap:anywhere; }
 .chat__actions button { flex-shrink:0; min-height:44px; padding:9px 16px; }
 .chat__hint { margin-top:5px; }
 .chat__support-state { max-height:16dvh; overflow:auto; }
 .chat__form { padding:10px 12px; padding-bottom:max(10px,env(safe-area-inset-bottom)); }
 .chat__feedback-note { margin-top:6px; }
 .chat__feedback-note textarea { min-height:36px; height:40px; }
 .mobile-typing .chat__hint,.mobile-short .chat__hint { display:none; }
 .mobile-typing .chat__feedback,.mobile-short .chat__feedback { display:none; }
 .mobile-typing .chat__header p,.mobile-short .chat__header p { display:none; }
 .mobile-short .chat__header { padding:4px 10px; }
 .mobile-short .chat__form { padding:5px 10px; }
 .mobile-short .chat__form textarea { min-height:36px; height:36px; }
 .mobile-short .chat__actions { margin-top:5px; }
 .mobile-short .chat__portal-link { padding:5px 8px; font-size:12px; }
 .mobile-short.mobile-typing .chat__header { display:none; }
 .mobile-short .chat__support-state { max-height:30px; }
}

/* A short landscape keyboard viewport gives the composer priority over history. */
@media (orientation:landscape) and (max-width:1100px) and (pointer:coarse) {
 .mobile-short.mobile-typing .chat__status,
 .mobile-short.mobile-typing .chat__support-state,
 .mobile-short.mobile-typing .chat__human-action { display:none; }
 .mobile-short.mobile-typing .chat__form { display:flex; align-items:center; gap:8px; padding:4px max(10px,env(safe-area-inset-right)) 4px max(10px,env(safe-area-inset-left)); }
 .mobile-short.mobile-typing .chat__form textarea { flex:1; min-width:0; width:auto; height:44px; min-height:44px; padding:8px; }
 .mobile-short.mobile-typing .chat__actions { margin:0; flex-shrink:0; }
 .mobile-short.mobile-typing .chat__portal-link { display:none; }
 .mobile-short.mobile-typing .chat__actions button { min-height:44px; }
}

@media(max-width:820px), (max-width:1100px) and (pointer:coarse) {
 body:has(.portal:not([hidden])) { overflow:hidden; }
 .mobile-typing .portal .composer-hint { display:none; }
 .mobile-short.mobile-typing .portal .topbar,
 .mobile-short.mobile-typing .portal .conversation-header { display:none; }
 .mobile-short.mobile-typing .portal .composer { padding:6px 12px; align-items:center; }
 .mobile-short.mobile-typing .portal .composer textarea { min-height:44px; height:44px; max-height:72px; }
}