*{box-sizing:border-box} :root{--app-height:100dvh;--green:#07b85b;--text:#202322;--muted:#87908a;--line:#dedfdf;--surface:#f7f7f7} [hidden]{display:none!important}
body{margin:0;color:var(--text);font:14px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;background:#ededed;letter-spacing:0}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.4;cursor:default}a{color:inherit;text-decoration:none}button,a,input{ -webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--green);outline-offset:3px}button{border:0;background:transparent;color:inherit}input{min-width:0;max-width:100%}.primary{background:var(--green);border-radius:5px;color:white;font-weight:600;min-height:44px;padding:10px 24px}.primary:hover{background:#06a951}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.auth-view{display:flex;flex-direction:column;align-items:center;min-height:var(--app-height);padding:36px 24px 16px;background:#fafafa}.auth-brand{align-self:flex-start;font-size:16px;font-weight:700}.auth-form{width:100%;max-width:340px;margin:auto;padding:40px 0}.app-icon{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 20px;background:var(--green);color:white;border-radius:8px;font:700 26px ui-monospace,monospace}.auth-form h1{text-align:center;font-size:25px;margin:0 0 8px}.auth-description{text-align:center;color:var(--muted);font-size:13px;margin:10px 0 24px}.auth-form label{display:block;margin:16px 0 7px;font-size:13px}.auth-form input{display:block;width:100%;border:1px solid var(--line);border-radius:5px;background:white;padding:12px;font-size:16px;min-height:46px}.auth-form .primary{width:100%;margin-top:24px}.feedback{color:#ac382c;font-size:13px;overflow-wrap:anywhere}.auth-link{display:block;text-align:center;font-size:13px;color:#4b8061}.auth-view footer{font-size:11px;color:var(--muted)}
.app-view{display:grid;grid-template-columns:64px 286px minmax(0,1fr);height:var(--app-height);min-height:240px;overflow:hidden}.rail{display:flex;align-items:center;flex-direction:column;gap:28px;background:#292c2b;color:#a3aba6;padding:28px 10px 20px}.rail a,.rail button,.rail-active{display:grid;place-items:center;width:40px;height:40px;font-size:26px;border-radius:6px}.rail-brand{background:#0dbb63;color:white;font:700 17px ui-monospace,monospace!important}.rail-active{color:#0fd071}.rail-logout{margin-top:auto}.rail-image:hover,.rail-logout:hover{background:#3a403c;color:white}.conversation-sidebar{display:flex;flex-direction:column;background:#f6f6f6;border-right:1px solid var(--line);min-width:0;min-height:0}.sidebar-heading{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;flex-shrink:0}.sidebar-heading h1{font-size:21px;font-weight:600;margin:0}.icon-button{display:inline-grid;place-items:center;min-width:38px;height:38px;font-size:24px;border-radius:4px}.icon-button:hover{background:#e4e7e5}.search-field{padding:0 16px 18px}.search-field input{width:100%;background:#e8eae8;border:0;border-radius:4px;padding:8px 10px;min-height:34px;font-size:13px}.conversation-list{overflow:auto;overscroll-behavior:contain;min-height:0;flex:1}.conversation-item{width:100%;min-height:82px;display:flex;align-items:center;gap:12px;padding:13px 16px;text-align:left;border-radius:0}.conversation-item:hover{background:#e7e9e7}.conversation-item[aria-current=true]{background:#dedfde}.session-avatar{flex:0 0 44px;height:44px;display:grid;place-items:center;border-radius:5px;background:#d9e8df;color:#298452;font:600 20px ui-monospace,monospace}.session-avatar.ssh{background:#dce5ec;color:#4d738d;font-size:27px}.session-summary{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.session-summary strong{font-size:14px;font-weight:550;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.session-summary>span{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.session-indicator{flex:0 0 10px;color:var(--green);font-size:11px}.session-indicator[data-state=error]{color:#b34a38}.sidebar-bottom{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);gap:8px}.sidebar-bottom button{padding:6px 0;color:#46725b;font-size:12px}.sidebar-bottom span{font-size:11px;color:var(--muted)}.account-summary{display:flex;align-items:center;gap:10px;padding:14px 16px;background:#eee}.account-avatar{display:grid;place-items:center;flex:0 0 32px;height:32px;background:#cadcd0;color:#416d50;border-radius:4px;font-size:14px}.account-summary div{display:flex;flex-direction:column;gap:3px;min-width:0}.account-summary strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-summary div span{font-size:10px;color:var(--muted)}.list-empty{text-align:center;color:var(--muted);font-size:13px;margin:20px}
.conversation{min-width:0;min-height:0;display:flex;flex-direction:column;position:relative}.conversation-heading{flex-shrink:0;height:78px;display:flex;align-items:center;gap:10px;justify-content:space-between;padding:12px 28px;border-bottom:1px solid var(--line);position:relative;background:#f5f5f5}.conversation-title{min-width:0;flex:1}.conversation-title h2{margin:0;font-size:17px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-title>span{font-size:11px;color:var(--muted);display:block;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-tools{display:flex;align-items:center;gap:12px;flex-shrink:0}.conversation-tools>button:first-child{font-size:12px;color:#24844b}.session-menu{position:absolute;right:20px;top:64px;min-width:170px;background:white;border:1px solid var(--line);border-radius:6px;box-shadow:0 8px 28px #00000015;padding:5px;z-index:5}.session-menu button{display:block;width:100%;text-align:left;padding:10px 14px;border-radius:3px}.session-menu button:hover{background:#edf3ef}.danger{color:#b34335}.session-frames{flex:1;position:relative;min-height:0}.session-frame{display:block;border:0;width:100%;height:100%;background:#ededed;position:absolute;inset:0}.workspace-empty{position:absolute;inset:100px 0 40px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px}.workspace-empty .app-icon{margin:0;opacity:.8}.workspace-empty h2{font-size:16px;font-weight:500;color:#737f77}.workspace-footer{display:flex;justify-content:space-between;gap:10px;padding:7px 18px;font-size:10px;color:#929b95;border-top:1px solid #e1e4e1;background:#f5f5f5}.workspace-message{flex-shrink:0;margin:0;padding:9px 18px;background:#fff9e8;color:#896c37;font-size:12px;overflow-wrap:anywhere}.mobile-only{display:none}.sidebar-shade{display:none}dialog{border:1px solid var(--line);border-radius:8px;padding:24px;width:min(380px,calc(100% - 32px));box-shadow:0 12px 50px #0002}dialog::backdrop{background:#0005}dialog h2{font-size:18px;margin:0 0 16px}dialog p{font-size:13px;color:#707a73}dialog input{width:100%;padding:10px;border:1px solid #cbd3cd;border-radius:4px;font-size:16px}dialog label{font-size:12px;margin-bottom:6px}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.dialog-actions button{min-width:74px;min-height:40px;border-radius:4px}.dialog-actions button:first-child{background:#eee}
@media(min-width:701px){.app-view{max-width:1680px;margin:0 auto;border-left:1px solid var(--line);border-right:1px solid var(--line)}}
@media(max-width:1000px) and (min-width:701px){.app-view{grid-template-columns:54px 230px minmax(0,1fr)}.conversation-heading{padding:12px 16px}.rail{padding-left:7px;padding-right:7px}.conversation-item{padding:12px;gap:9px}.workspace-footer span:last-child{display:none}}
@media(max-width:700px),(max-width:1000px) and (max-height:500px){.app-view{display:block}.rail{display:none}.conversation{height:100%;padding-bottom:env(safe-area-inset-bottom,0px)}.conversation-heading{height:64px;padding:8px 12px;padding-top:calc(8px + env(safe-area-inset-top,0px));min-height:64px}.conversation-title h2{font-size:16px}.conversation-tools{gap:5px}.mobile-only{display:inline-grid}.conversation-sidebar{position:fixed;inset:0 auto 0 0;width:min(320px,85vw);z-index:20;transform:translateX(-100%);visibility:hidden;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);transition:transform .18s}.list-open .conversation-sidebar{transform:translateX(0);visibility:visible}.sidebar-shade:not([hidden]){display:block;position:fixed;inset:0;background:#0004;z-index:19}.workspace-footer{font-size:9px;padding:4px 10px}.workspace-footer span:last-child{display:none}.sidebar-heading{height:64px}.sidebar-bottom{padding:16px}.account-summary{padding-right:56px;position:relative}.list-open .rail-logout{display:block}.workspace-message{font-size:11px;padding:7px 12px}.session-menu{right:12px;top:57px}.auth-view{padding:24px 24px 12px}.auth-form{padding:30px 0}.app-icon{width:56px;height:56px}.auth-brand{font-size:14px}}
@media(max-height:450px){.workspace-footer{display:none}.conversation-heading{height:50px;min-height:50px}.auth-form{padding:16px 0}.auth-form .app-icon{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* One visual viewport owns the mobile layout; frames inherit its exact size. */
body.terminal-app{height:100%;overflow:hidden;overscroll-behavior:none}
.mobile-session-actions{display:none}
@media(max-width:700px),(max-width:1000px) and (max-height:500px){
  body.terminal-app{position:fixed;inset:0;width:100%}
  .terminal-app .app-view{position:absolute;left:0;right:0;top:var(--app-top,0px);height:var(--app-height);min-height:0;max-width:none;border:0;margin:0}
  .conversation{padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) 0 env(safe-area-inset-left,0px)}
  .conversation-heading,.workspace-footer{display:none}
  .session-frames{min-height:0}
  .conversation-sidebar{top:var(--app-top,0px);bottom:auto;height:var(--app-height);max-height:var(--app-height)}
  .mobile-session-actions{display:flex;flex-wrap:wrap;gap:4px;padding:8px 12px;border-top:1px solid var(--line);flex-shrink:0}
  .mobile-session-actions button{flex:1;min-width:42px;min-height:40px;font-size:12px;border-radius:4px;background:#e9eeeb}
  .workspace-message{position:absolute;left:12px;right:12px;top:calc(env(safe-area-inset-top,0px) + 8px);z-index:4;border-radius:6px;max-height:72px;overflow:auto;box-shadow:0 2px 12px #0001;pointer-events:none}
  .workspace-empty{inset:0;padding:24px}
  .keyboard-open .conversation{padding-bottom:0}
}