:root{--brand:#032c28;--brand-deep:#02231f;--sage:#8a916b;--sage-light:#c2c9a0;--sage-pale:#e4e7cf;--cream:#fffef6;--cream-deep:#f2eedb;--background:#f7f5e9;--surface:#fffefb;--text:#173c36;--muted:#65766c;--border:#c9cda9;--white:#fff;--danger:#914b42;--danger-pale:#f6e3d9;--shadow:#032c281c}
*{box-sizing:border-box}
html{font-family:"Nunito",Arial,sans-serif}
body{min-height:100vh;margin:0;color:var(--text);background:var(--background);font-size:22px;line-height:1.5}
button,input,textarea{font:inherit}
.site-header{min-height:150px;display:flex;align-items:center;justify-content:center;position:relative;padding:1.4rem max(1rem,calc((100% - 1180px)/2));color:var(--cream);background:var(--brand);border-bottom:3px solid var(--sage);box-shadow:0 3px 16px var(--shadow)}
.wordmark{display:inline-flex;align-items:center;gap:.22em;color:inherit;font-size:clamp(3rem,6vw,5.5rem);font-weight:700;line-height:1;text-decoration:none}
.wordmark-logo{width:1.188em;height:1.188em;display:block;object-fit:contain}
.wordmark-text{display:inline-flex;align-items:baseline;font-size:.9em;letter-spacing:-.065em}
.wordmark-main{color:#fffef6}
.wordmark-accent{color:#c2c9a0}
.site-header form{position:absolute;right:max(1rem,calc((100% - 1180px)/2))}
.logout-button{min-height:44px;padding:.55rem .9rem;border:1px solid var(--sage-light);border-radius:.7rem;color:var(--cream);background:#ffffff0b;font-weight:800;cursor:pointer;transition:background .18s ease,color .18s ease}
.logout-button:hover{color:var(--brand);background:var(--sage-light)}
.login-page main{width:min(1180px,calc(100% - 2rem));margin:auto;padding:2rem 0}
.login-page{background:radial-gradient(circle at 50% 12%,var(--cream) 0,var(--background) 54%,var(--cream-deep) 100%)}
.login-card{width:min(100%,760px);margin:5vh auto;padding:2rem;border:1px solid var(--border);border-radius:1.2rem;background:var(--surface);box-shadow:0 18px 50px var(--shadow)}
.login-card h1{margin-top:0;text-align:center;font-size:2.333rem}
.form-stack{width:min(100%,440px);margin-inline:auto;display:grid;gap:1rem}
.form-stack label{display:grid;gap:.35rem;font-weight:700}
input{width:100%;min-height:50px;padding:.75rem 1rem;border:1px solid var(--border);border-radius:.65rem;color:var(--text);background:#fff}
input:focus{border-color:var(--sage)}
input:focus-visible,textarea:focus-visible,button:focus-visible{outline:3px solid var(--sage-light);outline-offset:2px}
.primary-button{min-height:50px;border:1px solid var(--brand);border-radius:.65rem;color:var(--cream);background:var(--brand);font-weight:800;cursor:pointer;box-shadow:0 6px 18px var(--shadow);transition:background .18s ease,border-color .18s ease}
.form-stack .primary-button{margin-top:1rem}
.primary-button:hover{border-color:var(--sage);background:#17453d}
.alert{width:min(100%,440px);margin:0 auto 1rem;padding:.8rem;border:1px solid #d7aaa0;border-radius:.6rem;color:var(--danger);background:var(--danger-pale)}
.password-field{position:relative;display:block}
.password-field input{padding-right:3.4rem}
.password-toggle{position:absolute;top:50%;right:.35rem;display:grid;place-items:center;width:44px;min-height:44px;padding:0;transform:translateY(-50%);border:0;color:var(--text);background:transparent;cursor:pointer}
.password-toggle svg,.composer-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.password-toggle .eye-hide,.password-toggle[aria-pressed="true"] .eye-show{display:none}
.password-toggle[aria-pressed="true"] .eye-hide{display:block}
.workspace-page{display:grid;grid-template-rows:auto 1fr;background:radial-gradient(circle at 50% 25%,var(--cream) 0,var(--background) 48%,var(--cream-deep) 100%)}
.workspace-page .site-header{min-height:98px;justify-content:flex-start;box-shadow:none}
.workspace-page .wordmark{font-size:clamp(2.1rem,4vw,3.3rem)}
.workspace-page main{display:grid;min-height:calc(100vh - 98px);padding:2rem}
.assistant-shell{width:min(900px,100%);height:min(760px,calc(100vh - 138px));margin:auto;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;justify-items:center;gap:1rem}
.assistant-intro{text-align:center}
.context-label{width:max-content;max-width:100%;margin:0 auto .75rem;padding:.3rem .7rem;border:1px solid var(--border);border-radius:99px;color:var(--brand);background:var(--sage-pale);font-size:calc(.85rem + 4px);font-weight:800}
.assistant-intro h1{margin:0;font-size:clamp(2.083rem,calc(5vw + 1.333px),3.683rem);line-height:1.12}
.assistant-intro>p:last-child{margin:.8rem 0 0;color:var(--muted)}
.assistant-intro{transition:opacity .2s ease,transform .2s ease}
.assistant-intro.is-compact{position:absolute;opacity:0;pointer-events:none;transform:translateY(-8px)}
.conversation{width:100%;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:.8rem;padding:.5rem .2rem;scrollbar-color:var(--sage-light) transparent;scrollbar-width:thin}
.message{max-width:min(78%,680px);padding:.75rem 1rem;border-radius:1.15rem;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:0 5px 18px var(--shadow)}
.message-user{align-self:flex-end;color:var(--cream);background:var(--brand);border:1px solid var(--brand-deep);border-bottom-right-radius:.35rem}
.message-assistant{align-self:flex-start;color:var(--text);background:var(--surface);border:1px solid var(--border);border-bottom-left-radius:.35rem}
.message.is-loading{color:var(--muted);animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.55}}
.composer{width:100%;min-height:76px;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:end;gap:.5rem;padding:.7rem;border:1px solid var(--border);border-radius:1.5rem;background:#fff;box-shadow:0 18px 50px var(--shadow)}
.composer textarea{width:100%;max-height:180px;min-height:48px;resize:none;padding:.72rem .4rem;border:0;outline:0;color:var(--text);background:transparent;font-size:calc(1.05rem + 4px)}
.composer-icon{width:48px;height:48px;display:grid;place-items:center;padding:0;border:1px solid var(--border);border-radius:50%;color:var(--brand);background:var(--sage-pale);transition:background .18s ease,border-color .18s ease}
.composer-icon:hover{border-color:var(--sage);background:var(--sage-light)}
.composer-icon:disabled{opacity:.72;cursor:not-allowed}
.composer-icon.is-recording{color:#fff;background:#b52e36;animation:recording-pulse 1.2s ease-in-out infinite}
@keyframes recording-pulse{50%{box-shadow:0 0 0 8px #b52e3630}}
.send-button{color:var(--cream);border-color:var(--brand);background:var(--brand);cursor:pointer}
.send-button:hover{color:var(--brand);border-color:var(--sage);background:var(--sage-light)}
.composer.is-busy .send-button{opacity:.55;cursor:wait}
.phase-note{margin:0;color:var(--muted);font-size:calc(.8rem + 4px);text-align:center}
.attachment-chip{justify-self:start;display:flex;align-items:center;gap:.55rem;max-width:100%;padding:.4rem .7rem;border:1px solid var(--border);border-radius:99px;background:var(--sage-pale);font-size:calc(.85rem + 4px);font-weight:700}
.attachment-chip[hidden]{display:none}.attachment-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attachment-chip button{border:0;background:transparent;color:var(--brand);font-size:1.25rem;cursor:pointer}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:700px){
  body{font-size:21px}
  .site-header{min-height:120px;padding:1rem}
  .wordmark{font-size:clamp(2.7rem,15vw,4rem)}
  .login-page main{width:calc(100% - 1.2rem);padding:1rem 0}
  .login-card{margin:1rem auto;padding:1.25rem}
  .workspace-page .site-header{min-height:78px;padding:.85rem 1rem}
  .workspace-page .wordmark{font-size:2.25rem}
  .workspace-page .site-header form{right:1rem}
  .logout-button{min-height:40px;padding:.4rem .65rem}
  .workspace-page main{min-height:calc(100vh - 78px);padding:1rem}
  .assistant-shell{height:calc(100dvh - 98px);align-content:stretch;gap:.8rem}
  .login-card h1{font-size:2.208rem}
  .assistant-intro h1{font-size:2.083rem}
  .composer{min-height:68px;padding:.5rem;border-radius:1.25rem}
  .composer-icon{width:44px;height:44px}
  .composer textarea{min-height:44px;padding:.6rem .2rem}
  .message{max-width:88%;font-size:calc(.95rem + 4px)}
  .composer{gap:.2rem}
}
