:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#f1f1ee;background:#090a09}*{box-sizing:border-box}body{margin:0;min-height:100vh}header{height:72px;border-bottom:1px solid #242724;display:flex;align-items:center;justify-content:flex-end;padding:0 7%;background:#090a09}.brand{display:flex;align-items:center;gap:10px;color:#f4f4ef;text-decoration:none;font-size:18px;letter-spacing:-.5px}.mark{display:grid;place-items:center;width:35px;height:35px;background:#d6e8bb;color:#141c10;font-weight:750;border-radius:10px}.head-right{display:flex;align-items:center;gap:20px}.model{font-size:12px;color:#b6c4ad;border:1px solid #343b32;border-radius:6px;padding:7px 10px}main{max-width:920px;margin:auto;padding:62px 24px}.workspace{max-width:780px;margin:auto}.chat-head{display:flex;justify-content:space-between;gap:20px;align-items:start}.eyebrow{font-size:11px;letter-spacing:.13em;font-weight:750;color:#a5bd94}h1{font-size:clamp(27px,4vw,39px);line-height:1.2;letter-spacing:-1.4px;margin:15px 0 9px}p{color:#a5aca2;line-height:1.6;margin:0}.quiet{border:0;background:transparent;color:#c4d9b5;font:inherit;font-size:13px;cursor:pointer;padding:10px 0;white-space:nowrap}.messages{display:flex;flex-direction:column;gap:20px;margin:42px 0 24px;min-height:170px}.message{max-width:88%;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}.message.user{align-self:flex-end;background:#242b22;padding:13px 17px;border-radius:16px 16px 3px 16px}.message.assistant{align-self:flex-start;padding:4px 0}.message-label{display:block;color:#a5bd94;font-size:11px;font-weight:750;letter-spacing:.08em;margin-bottom:7px}.composer{background:#171a17;border:1px solid #3a4139;border-radius:17px;padding:17px}textarea{font:inherit;color:#f3f5ef;border:0;resize:vertical;outline:none;min-height:60px;width:100%;background:transparent}textarea::placeholder{color:#919a90}.composer-bottom{display:flex;align-items:center;justify-content:space-between;color:#9ba39a;font-size:11px}.send,.primary{border:0;background:#d6e8bb;color:#162012;cursor:pointer}.send{border-radius:10px;width:39px;height:39px;font-size:22px}.send:disabled{opacity:.5}.footnote{text-align:center;font-size:11px;margin-top:14px;color:#9ba39a}.login{max-width:380px;margin:8vh auto}.login form{margin-top:30px;display:grid;gap:12px}.login label{font-size:13px;font-weight:650}.login input{font:inherit;padding:14px;background:#171a17;color:#fff;border:1px solid #485047;border-radius:8px}.primary{padding:14px;border-radius:8px;font:inherit;font-weight:650}.error{color:#ffaaa3;font-size:13px;margin:8px 0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}:focus-visible{outline:3px solid #c2dfad;outline-offset:3px}@media(max-width:600px){header{padding:0 20px}main{padding:40px 18px}.chat-head{display:block}.quiet{margin-top:8px}.messages{min-height:130px;margin-top:28px}.composer-bottom span{font-size:10px}.message{max-width:95%}}

.login-logo{display:block;width:min(240px,70%);height:auto;margin:0 auto 36px}
.login label{text-align:center}
.primary:disabled{opacity:.6;cursor:wait}

/* Keep the conversation scrollable while the composer stays visible. */
body.chat-active{height:100vh;height:100dvh;min-height:0;overflow:hidden;display:flex;flex-direction:column}
.chat-active header{flex:0 0 72px}
.chat-active main{width:100%;flex:1;min-height:0;display:flex;flex-direction:column;padding:32px 24px 18px}
.workspace:not([hidden]){width:100%;flex:1;min-height:0;display:flex;flex-direction:column}
.chat-head,.composer,.footnote{flex-shrink:0}
.messages{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;margin:24px 0 16px;padding:0 8px 0 0}
.composer textarea{max-height:20vh;max-height:20dvh}
@media(max-width:600px){.chat-active header{flex-basis:56px;height:56px}.chat-active main{padding:16px 18px 10px}.chat-head h1{font-size:25px;margin:8px 0}.chat-head p{font-size:13px}.chat-head .quiet{margin-top:0}.messages{min-height:0;margin:12px 0}.composer{padding:12px}.footnote{margin-top:8px}}
.chat-layout:not([hidden]){width:100%;flex:1;min-height:0;display:flex;gap:28px}.chat-active main{max-width:1200px}.sidebar{width:230px;flex:0 0 230px;min-height:0;display:flex;flex-direction:column;border-right:1px solid #292d29;padding:4px 18px 0 0}.history-title{font-size:15px;font-weight:700;color:#f1f1ee}.history-new{background:#20251f;color:#d6e8bb;border:1px solid #384136;border-radius:9px;padding:11px;text-align:left;margin:18px 0;font:inherit;cursor:pointer}#history-list{overflow-y:auto;min-height:0;display:flex;flex-direction:column;gap:4px}.history-item{background:transparent;border:0;border-radius:8px;color:#c7cfc5;padding:10px;text-align:left;font:inherit;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.history-item:hover,.history-item.active{background:#262d24;color:#fff}.history-empty{font-size:12px}.chat-layout .workspace{max-width:780px}
@media(max-width:600px){.chat-layout:not([hidden]){gap:12px}.sidebar{width:105px;flex-basis:105px;padding-right:10px}.history-new{font-size:12px;padding:8px}.history-item{font-size:12px;padding:8px 4px}.chat-layout .workspace{width:0}.chat-head h1{font-size:21px}.chat-head p{display:none}}

body:not(.chat-active) header{border-bottom:0}
.chat-layout .workspace{min-width:0}
.composer{display:flex;flex-direction:column;gap:8px;width:100%;padding:16px 18px 12px}
.composer textarea{display:block;min-width:0;min-height:68px;padding:0;line-height:1.55;resize:none;overflow-y:auto}
.composer:focus-within{border-color:#9eb994}
.composer-bottom{min-height:40px;gap:12px}
.composer-bottom span{line-height:1.4}
@media(max-width:600px){.chat-layout .workspace{width:auto;min-width:0}.composer{padding:12px}.composer textarea{min-height:54px}.composer-bottom span{max-width:calc(100% - 46px)}}

/* Keep the conversation and history within the viewport. */
.chat-layout:not([hidden]){height:100%;overflow:hidden;align-items:stretch}
.chat-layout .workspace{height:100%;min-height:0;margin:0 auto;align-self:stretch}
.chat-layout .sidebar{height:100%;overflow:hidden}
.messages{flex:1 1 0;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}
.message{flex:0 0 auto}
.composer{background:#1b1b1e;border-color:#414148;box-shadow:0 8px 24px #0003}
.composer:focus-within{border-color:#aaaab4}
.composer textarea{color:#f5f5f6;caret-color:#f5f5f6}
.composer textarea::placeholder{color:#a3a3ac}
.composer-bottom{color:#a3a3ac}
.composer .send{background:#f1f1f2;color:#18181a}
.composer .send:hover:not(:disabled){background:#d6d6dc}