*{box-sizing:border-box}body{margin:0;display:flex;font:15px/1.5 system-ui,sans-serif;color:#23332e;background:#f6f7f3}button,select,textarea{font:inherit}button,.upload{cursor:pointer;border:1px solid #cbd7ce;background:white;padding:9px 15px;border-radius:9px;color:#234936}button:hover,.upload:hover{background:#eef4e9}button:disabled{opacity:.5;cursor:wait}aside{width:230px;flex-shrink:0;background:#e9eee5;border-right:1px solid #d7dfd2;padding:27px 20px;min-height:100vh}.brand{display:block;text-decoration:none;color:#254834;font-size:29px;font-weight:750;letter-spacing:-1.2px;margin-bottom:28px}.brand span{display:block;font-size:12px;font-weight:400;letter-spacing:0}aside>button{width:100%}nav{margin-top:18px}nav button{display:block;width:100%;text-align:left;margin-bottom:8px;border-color:transparent;background:transparent;overflow-wrap:anywhere}nav button.active{background:#fff}.local{font-size:12px;color:#6d786b;margin-top:30px}main{padding:27px 32px;width:calc(100% - 230px)}header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}.eyebrow{font-size:10px;letter-spacing:2px;color:#71806e;margin:0}h1{font-size:26px;line-height:1.2;margin:6px 0}h2{font-size:17px;margin:0}.settings{display:flex;gap:15px;align-items:flex-end;flex-wrap:wrap;margin-bottom:22px}.settings>label{font-size:12px;display:flex;flex-direction:column;gap:4px}select{max-width:340px;background:#fff;padding:8px;border:1px solid #ccd6c8;border-radius:7px}fieldset{border:0;margin:0;padding:0;display:flex;gap:8px;font-size:12px}legend{margin-bottom:5px;color:#65735e}fieldset label{white-space:nowrap}.workbench{display:grid;grid-template-columns:minmax(300px,1fr) minmax(300px,1fr);gap:24px}.conversation,.design{background:white;border:1px solid #dce2d7;border-radius:15px;overflow:hidden}.conversation{height:calc(100vh - 224px);min-height:480px;display:flex;flex-direction:column}#messages{padding:24px;flex:1;overflow:auto}.empty{margin:60px 0;color:#768171;text-align:center}.empty h2{color:#314d36}.message{padding:12px 15px;background:#f1f4ee;border-radius:12px;margin-bottom:14px;white-space:pre-wrap;overflow-wrap:anywhere}.message.user{background:#dcebd0;margin-left:35px}.message small{display:block;color:#73836a;font-size:10px;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px}#composer{border-top:1px solid #e1e7dc;padding:15px}textarea{width:100%;resize:vertical;border:1px solid #d5dece;border-radius:8px;padding:10px;background:#fafbf8;min-height:70px}.compose-actions{display:flex;align-items:center;gap:8px;margin-top:8px}#send{margin-left:auto;background:#315d38;color:#fff;border-color:#315d38}#attached{font-size:11px;max-width:130px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.upload{font-size:12px;padding:7px 10px}.design{padding:20px;align-self:start}.panel-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.subtle{padding:5px 9px;font-size:11px}#preview{height:320px;display:flex;align-items:center;justify-content:center;background-color:#f8faf5;background-image:radial-gradient(#dce4d5 1px,transparent 1px);background-size:18px 18px;border-radius:10px;color:#798573}#preview img{width:100%;height:100%;object-fit:contain}#preview p{padding:20px;text-align:center}#files{margin:16px 0;max-height:240px;overflow:auto}.file{display:flex;gap:8px;align-items:center;border-bottom:1px solid #ecf0e7;padding:8px 0;font-size:12px}.file button{border:0;background:transparent;padding:2px;flex:1;text-align:left;overflow-wrap:anywhere}.file a{color:#457548;font-size:11px}.file.selected{background:#eff4ea}details{border-top:1px solid #e1e7dc;padding:11px 0;font-size:12px}summary{cursor:pointer;color:#62765a}#activity pre,pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px}#activity{max-height:300px;overflow:auto}.hint{color:#738369;font-size:11px}#error{background:#f9e5db;border-radius:8px;padding:10px;margin-bottom:15px;white-space:pre-wrap}button:focus-visible,select:focus-visible,textarea:focus-visible,.upload:focus-within{outline:3px solid #98b781;outline-offset:2px}@media(max-width:1000px){aside{width:180px}main{width:calc(100% - 180px);padding:20px}.workbench{gap:15px;grid-template-columns:1fr}.conversation{height:550px}.settings>label select{max-width:270px}}@media(max-width:600px){body{display:block}aside{width:100%;min-height:0;padding:12px 18px;border-right:0}.brand{font-size:22px;margin:0 0 10px}.brand span{display:inline;margin-left:10px}nav{display:flex;overflow:auto;gap:5px;margin-top:10px}nav button{width:auto;white-space:nowrap;margin:0}.local{display:none}main{width:100%;padding:18px}h1{font-size:22px}.settings{gap:10px}.settings>label{width:100%}select{max-width:100%!important}.conversation{height:530px;min-height:0}.workbench{grid-template-columns:minmax(0,1fr)}#preview{height:270px}}
body.signed-out > aside, body.signed-out > main { display: none; }
#login-screen { position: fixed; inset: 0; background: #f6f4ef; overflow: auto; padding: 8vh 24px; z-index: 100; }
#login-screen[hidden] { display: none; }
#login-form { max-width: 420px; margin: auto; padding: 32px; background: white; border-radius: 16px; box-shadow: 0 8px 32px #0001; }
#login-form h1 { font-size: 26px; margin: 30px 0 24px; }
#login-form label { display: block; margin: 16px 0; }
#login-form input { display: block; width: 100%; padding: 12px; margin-top: 8px; border: 1px solid #aaa; border-radius: 6px; }
#login-error { color: #a52929; min-height: 1em; }
#account { margin-top: 20px; font-size: 13px; overflow-wrap: anywhere; }
#account button { margin-top: 8px; }

#spending { font-size: .8rem; color: #596865; padding: 8px 0; }
#spending strong { color: #9b4d12; }
.pilot-dialog { width: min(1000px,95vw); max-height: 90vh; overflow: auto; padding: 24px; border: 1px solid #ced8d3; border-radius: 12px; }
.pilot-dialog::backdrop { background: #0007; }
.pilot-settings { display: grid; grid-template-columns: repeat(auto-fit,minmax(190px,1fr)); gap: 12px; }
.pilot-settings label { display: flex; flex-direction: column; gap: 6px; }
.pilot-user,.pilot-project { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 12px 0; }
.pilot-user label,.pilot-project span { flex: 1; }
.pilot-user input { width: 100px; }
.pilot-table { overflow-x: auto; }
.pilot-table th,.pilot-table td { padding: 8px; text-align: left; border-bottom: 1px solid #ddd; white-space: nowrap; }

#invitation-screen[hidden] { display: none; }
#invitation-screen { position: fixed; inset: 0; z-index: 20; display: grid; place-items: center; background: #f6f7f3; padding: 20px; }
#invitation-screen form { width: min(420px,100%); padding: 30px; background: white; border: 1px solid #dce2d7; border-radius: 15px; }
#invitation-screen label { display: flex; flex-direction: column; gap: 6px; margin: 16px 0; }
#invitation-screen input { font: inherit; padding: 10px; border: 1px solid #cbd7ce; border-radius: 8px; }
#invitation-screen [role="alert"] { color: #9b3a20; }
.invitation-result { padding: 12px; background: #eef4e9; border-radius: 8px; margin: 12px 0; }
.invitation-result input { width: 100%; font: inherit; padding: 8px; }

.pilot-invite { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin: 12px 0; }
.pilot-invite label { display: flex; flex-direction: column; gap: 6px; flex: 1; }
.pilot-invite input { width: 100%; padding: 8px; font: inherit; border: 1px solid #cbd7ce; border-radius: 8px; }
.settings fieldset { flex-wrap: wrap; min-width: 0; max-width: 100%; }

header{position:relative;margin-bottom:16px;align-items:center;min-height:36px}
.project-heading{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;min-width:0}
.project-heading h1{margin:0;overflow-wrap:anywhere}
#spending{font-size:12px;color:#89918b;padding:0}
.header-actions{display:flex;align-items:center;gap:12px;flex-shrink:0}
.experiment{border:0;padding:0}
.experiment>summary{list-style:none;padding:6px 10px;border:1px solid #d7dfd2;border-radius:8px;white-space:nowrap}
.experiment>summary::-webkit-details-marker{display:none}
.experiment[open]>summary{background:#e9eee5}
.experiment .settings{position:absolute;right:0;top:calc(100% + 8px);z-index:10;width:min(760px,100%);padding:20px;margin:0;background:#fff;border:1px solid #d7dfd2;border-radius:12px;box-shadow:0 8px 30px #23332e18;align-items:end}
.settings #model-prices{flex-basis:100%;margin:0}
.project-maintenance{display:flex;gap:8px;flex-basis:100%;border-top:1px solid #e1e7dc;padding-top:12px}
.danger{color:#924d3c}
.conversation{height:calc(100vh - 115px)}
@media(max-width:1000px){.conversation{height:calc(100vh - 110px);min-height:480px}}
@media(max-width:600px){header{align-items:flex-start;flex-wrap:wrap;gap:10px}.header-actions{margin-left:auto}.experiment .settings{width:100%;padding:16px}.conversation{height:65vh;min-height:430px}}

.project-usage{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;flex-basis:100%;font-size:12px;color:#65735e}

.local a{color:inherit;text-underline-offset:2px}
.project-overview{flex-basis:100%;border-bottom:1px solid #e1e7dc;padding-bottom:12px}.project-overview h2{font-size:13px}.project-overview p{margin:6px 0 0;font-size:13px;color:#65735e;white-space:normal;overflow-wrap:anywhere}
