/* Keep the guest notice in normal flow instead of letting it consume the
   workspace's flexible grid row (and pushing the conversation off screen). */
.workspace{display:flex;flex-direction:column;min-width:0;height:100vh;min-height:0;overflow:hidden}
.workspace-scroll{flex:1 1 auto;min-height:0;overflow-y:auto}
.workspace-scroll>.conversation,.workspace-scroll>.programmer,.workspace-scroll>.controller{flex:1 0 auto;min-width:0}
.topbar{flex:0 0 auto;gap:10px}
.topbar .current-chat-heading{flex:1 1 auto;min-width:0;max-width:none;text-align:center}
.topbar .top-actions{flex:0 0 auto}
.guest-banner{flex:0 0 auto;min-width:0}
.guest-banner>span{min-width:0;overflow-wrap:anywhere}
.sidebar-close,.sidebar-backdrop{display:none}
.install-app{display:block;width:100%;margin-top:8px;padding:10px 12px;border:1px solid rgba(240,215,139,.55);border-radius:9px;background:rgba(0,45,30,.25);color:#f8e2a1;text-align:left;cursor:pointer;font-size:13px}
.install-app:hover{background:rgba(240,215,139,.16)}
.install-app[hidden]{display:none}
.install-dialog p{margin:0;padding:18px;line-height:1.55;color:#314239}
body.theme-dark .install-dialog p{color:#edf8f1}
.install-offer{display:none}
.message-text,.programmer-message p{overflow-wrap:anywhere}
.message-body img,.message-body video,.message-body pre{max-width:100%}
.message-body pre{overflow-x:auto}

@media(max-width:760px){
  .shell{min-width:0}
  .workspace{height:100dvh;min-height:0}
  .topbar{min-height:58px;padding-inline:10px}
  .topbar .current-chat-heading strong{font-size:13px}
  .topbar .top-actions{gap:5px}
  .topbar .details-button{display:none}
  .menu-button,.theme-toggle,.owner-profile span{min-width:36px;min-height:36px}
  .guest-banner{padding:10px 12px;gap:9px;line-height:1.35}
  .guest-banner>div{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .guest-banner button{min-height:40px;white-space:normal}
  .install-offer:not([hidden]){display:grid;grid-template-columns:40px minmax(0,1fr) auto 28px;gap:7px;align-items:center;padding:9px 10px;border-bottom:1px solid #d9c383;background:#fffaf0;color:#244535}
  .install-offer img{width:40px;height:40px;border-radius:9px}
  .install-offer>div{min-width:0;display:grid;gap:1px}
  .install-offer strong{font-size:12px;line-height:1.2}
  .install-offer small{font-size:10px;line-height:1.2;color:#617366}
  .install-offer a{width:max-content;font-size:10px;color:#075f3d}
  .install-offer-links{display:flex;flex-wrap:wrap;gap:2px 7px;align-items:center}
  .install-offer-links button{padding:0;border:0;background:transparent;color:#536459;text-decoration:underline;cursor:pointer;font-size:10px}
  .install-offer-primary{min-height:36px;padding:6px 9px;border:0;border-radius:8px;background:#096846;color:#fff;cursor:pointer;font-size:11px;font-weight:700}
  .install-offer-dismiss{width:28px;height:32px;border:0;background:transparent;color:#536459;cursor:pointer;font-size:22px}
  .sidebar{width:min(300px,86vw);height:100dvh;padding-bottom:calc(14px + env(safe-area-inset-bottom));z-index:8}
  .sidebar .brand{padding-bottom:12px}
  .sidebar-close{display:grid;place-items:center;width:38px;height:38px;margin-left:auto;border:1px solid rgba(240,215,139,.55);border-radius:10px;background:rgba(0,35,22,.25);color:#fff;font-size:26px;cursor:pointer}
  .sidebar-backdrop:not([hidden]){display:block;position:fixed;inset:0;z-index:7;border:0;background:rgba(3,24,18,.54)}
  .conversation{width:calc(100% - 24px);padding-top:16px;padding-bottom:calc(118px + env(safe-area-inset-bottom))}
  .welcome{min-height:calc(100dvh - 270px)}
  .welcome h1{font-size:clamp(21px,6vw,26px);line-height:1.18}
  .welcome>p{font-size:13px;line-height:1.45}
  .message{grid-template-columns:28px minmax(0,1fr);gap:8px;padding:11px;margin-bottom:10px}
  .avatar{width:27px;height:27px}
  .message-head{flex-wrap:wrap;gap:5px;font-size:12px}
  .message-text{font-size:14px;line-height:1.5}
  .composer{left:0;right:0;bottom:0;padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
  .composer-line{grid-template-columns:minmax(0,1fr) 40px;gap:3px}
  .composer-primary{min-width:0;grid-template-columns:36px minmax(0,1fr) 36px 36px;gap:2px;padding:5px}
  .composer-primary textarea{min-width:0;font-size:16px}
  .composer-icon{min-width:34px;min-height:34px}
  .composer-line>.send{min-width:38px;min-height:38px}
  .attachment-card{max-width:min(320px,calc(100vw - 36px))}
  .attachment-upload-state{grid-template-columns:minmax(0,1fr);gap:5px}
  .programmer{height:calc(100dvh - 58px)}
  .programmer-bar{min-width:0;gap:8px}
  .project-button{min-width:0;max-width:100%;flex:1}
  .project-button strong{max-width:calc(100vw - 160px)}
  .programmer-bar-actions{flex:0 0 auto}
  .programmer-composer{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
  .programmer-composer textarea{font-size:16px}
  .controller{height:auto;min-height:calc(100dvh - 58px)}
  dialog{max-width:calc(100vw - 20px);max-height:calc(100dvh - 20px);overflow-y:auto}
  .auth-gate{padding:12px;overflow-y:auto}
  .auth-card{padding:20px;width:min(430px,100%);max-height:calc(100dvh - 24px);overflow-y:auto}
  .auth-card h1{font-size:24px;margin-top:18px}
  .auth-form input,.auth-form select,.account-settings-form input,.account-settings-form textarea,.account-settings-form select,.account-security-block input{font-size:16px}
  .account-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
  .account-dialog-head{padding:14px}
  .account-profile-main{padding:16px 14px}
  .account-profile-details{margin-inline:14px}
  .account-profile-details div{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:8px}
  .account-tabs{margin-inline:14px}
  .account-settings-form,.account-security-block{margin:14px;padding:12px}
  .account-dialog-actions{padding:14px;flex-wrap:wrap}
  .account-dialog-actions button{min-height:40px}
}

@media(max-width:360px){
  .topbar{gap:5px;padding-inline:7px}
  .topbar .top-actions{gap:3px}
  .guest-banner{font-size:12px}
  .composer-primary{grid-template-columns:33px minmax(0,1fr) 33px 33px}
  .composer-icon{min-width:32px;min-height:32px}
  .controller-summary,.memory-summary{grid-template-columns:1fr}
  .install-offer:not([hidden]){grid-template-columns:40px minmax(0,1fr) 28px}
  .install-offer-primary{grid-column:1/-1;grid-row:2}
  .install-offer-dismiss{grid-column:3;grid-row:1}
}

@media(display-mode:standalone){.install-offer,.install-app{display:none!important}}