:root{color-scheme:light;--bg:#f5f7fb;--panel:#ffffff;--panel2:#f2f5f9;--line:rgba(28,39,55,.1);--line2:rgba(28,39,55,.18);--text:#172033;--muted:#526077;--muted2:#78859a;--mint:#087f67;--violet:#6754c6;--amber:#a85d0b;--red:#c33d50;--blue:#316bd6;--shadow:0 10px 30px rgba(32,47,70,.08);font-family:Inter,Pretendard,"Apple SD Gothic Neo",system-ui,sans-serif}*{box-sizing:border-box}html,body{height:100%}body{margin:0;min-width:320px;overflow:hidden;background:var(--bg);color:var(--text)}button,input,textarea{font:inherit;color:inherit}button{cursor:pointer}.hidden{display:none!important}.eyebrow,.project-rail header span,.agent-drawer header span,.activity-panel>header span{color:var(--mint);font-size:9px;font-weight:800;letter-spacing:.17em}.primary{border-color:#087f67!important;background:#087f67!important;color:#fff!important}
.auth-screen{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:radial-gradient(circle at 50% 0,rgba(117,230,195,.08),transparent 35%),var(--bg)}.auth-brand{position:absolute;top:32px;left:40px;display:flex;align-items:center;gap:12px}.auth-brand strong{letter-spacing:.16em}.auth-brand small{color:var(--muted2);font-size:9px}.triad-mark{position:relative;display:inline-block;width:38px;height:38px;border:1px solid var(--line2);border-radius:11px;background:linear-gradient(145deg,#fff,#e9f4f1)}.triad-mark i{position:absolute;width:7px;height:7px;border-radius:50%}.triad-mark i:nth-child(1){top:8px;left:15px;background:var(--mint)}.triad-mark i:nth-child(2){left:8px;bottom:8px;background:var(--violet)}.triad-mark i:nth-child(3){right:8px;bottom:8px;background:var(--amber)}.auth-card{width:min(430px,calc(100% - 32px));display:grid;gap:16px;border:1px solid var(--line2);border-radius:18px;background:rgba(255,255,255,.94);padding:32px;box-shadow:0 30px 90px #0008}.auth-card h1{margin:0;font-size:25px}.auth-card p{margin:0 0 8px;color:var(--muted);font-size:13px;line-height:1.6}.auth-card label{display:grid;gap:7px;color:var(--muted);font-size:11px}.auth-card input{border:1px solid var(--line2);border-radius:9px;background:var(--panel2);padding:12px}.auth-actions{display:flex;gap:8px}.auth-actions button{flex:1;border:1px solid var(--line2);border-radius:9px;background:var(--panel2);padding:11px}
.titlebar{position:fixed;inset:0 0 auto;z-index:50;height:42px;display:grid;grid-template-columns:180px minmax(260px,560px) 1fr;align-items:center;border-bottom:1px solid var(--line);background:var(--panel);padding:0 16px}.titlebar-product{display:flex;align-items:center;gap:9px;font-size:11px;letter-spacing:.16em}.titlebar-product span{display:grid;width:22px;height:22px;place-items:center;border:1px solid var(--line2);border-radius:6px;color:var(--mint)}.titlebar-command{height:27px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:7px;background:rgba(255,255,255,.025);padding:0 11px;color:var(--muted);font-size:10px}.search-icon{font-size:15px}.titlebar-context{display:flex;justify-content:flex-end;align-items:center;gap:7px;color:var(--muted);font-size:9px}.titlebar-context i,.node-status i,.agent-policy i{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(117,230,195,.1)}.titlebar-context small{color:var(--muted2)}.language-toggle{border:1px solid var(--line2);border-radius:999px;background:var(--panel2);color:var(--text);padding:4px 9px;font:700 9px/1.2 Inter,system-ui,sans-serif;cursor:pointer}.language-toggle:hover{border-color:var(--mint)}.language-toggle-auth{position:fixed;z-index:110;top:14px;right:16px}
@media(max-width:760px){.titlebar-context{display:flex!important;position:fixed;top:8px;right:8px}.titlebar-context>i,.titlebar-context>span,.titlebar-context>small{display:none}}
.sidebar{position:fixed;inset:42px auto 0;z-index:40;width:72px;display:flex;flex-direction:column;align-items:center;border-right:1px solid var(--line);background:var(--panel2);padding:17px 10px 13px}.brand-button{border:0;background:none;padding:0 0 20px}.sidebar nav{display:grid;gap:9px}.side-item{width:48px;min-height:48px;display:grid;place-items:center;border:1px solid transparent;border-radius:14px;background:transparent;color:var(--muted2)}.side-item span{font-size:19px}.side-item small{display:none}.side-item:hover,.side-item.active{border-color:rgba(117,230,195,.15);background:rgba(117,230,195,.1);color:var(--mint)}.sidebar-spacer{flex:1}.node-status{display:grid;place-items:center;gap:8px;color:var(--muted2);font:8px ui-monospace,monospace}.oauth-lock{width:46px;height:46px;display:grid;grid-template-columns:auto auto;place-items:center;border:1px solid var(--line);border-radius:14px;margin-top:13px;color:var(--mint);font-size:14px}.oauth-lock span{display:none}
.workspace-shell{position:fixed;inset:42px 0 0 72px;display:grid;grid-template-columns:244px minmax(480px,1fr) 320px;background:var(--bg)}.project-rail{min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;border-right:1px solid var(--line);background:linear-gradient(180deg,rgba(117,230,195,.035),transparent 26%),var(--panel);padding:18px 12px 12px}.project-rail>header,.agent-drawer>header,.activity-panel>header{display:flex;align-items:center;justify-content:space-between;padding:0 6px 14px}.project-rail h2,.agent-drawer h2,.activity-panel h2{margin:4px 0 0;font-size:17px}.project-rail>header button{width:28px;height:28px;border:1px solid rgba(117,230,195,.2);border-radius:8px;background:rgba(117,230,195,.1);color:var(--mint)}.project-list{display:grid;align-content:start;gap:3px;overflow:auto}.project-item{width:100%;min-height:54px;display:grid;grid-template-columns:32px minmax(0,1fr) 6px;align-items:center;gap:9px;border:1px solid transparent;border-radius:10px;background:transparent;padding:7px;text-align:left}.project-item:hover,.project-item.active{border-color:var(--line);background:rgba(255,255,255,.035)}.project-item.active{border-color:rgba(117,230,195,.14);background:rgba(117,230,195,.08)}.project-icon{display:grid;width:30px;height:30px;place-items:center;border-radius:8px;background:rgba(173,156,255,.12);color:var(--violet);font-size:8px;font-weight:800}.project-item>span:nth-child(2){min-width:0}.project-item strong,.project-item small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.project-item strong{font-size:10px}.project-item small{margin-top:5px;color:var(--muted2);font-size:8px}.project-item>i{width:6px;height:6px;border-radius:50%;background:var(--mint)}.rail-files{max-height:180px;border-top:1px solid var(--line);padding-top:12px}.rail-files header{display:flex;justify-content:space-between;color:var(--muted);font-size:8px}.rail-files button{border:0;background:none;color:var(--mint);font-size:8px}.rail-files>div{display:grid;gap:7px;padding:10px 3px;color:var(--muted2);font-size:8px}.project-rail>footer{border-top:1px solid var(--line);padding-top:10px}.project-rail>footer button{width:100%;display:flex;align-items:center;gap:9px;border:0;border-radius:9px;background:transparent;padding:7px;text-align:left}.project-rail>footer button:hover{background:rgba(255,255,255,.035)}#user-avatar{display:grid;width:28px;height:28px;place-items:center;border-radius:8px;background:var(--panel2);color:var(--mint);font-size:8px}.project-rail footer strong,.project-rail footer small{display:block}.project-rail footer strong{font-size:9px}.project-rail footer small{margin-top:3px;color:var(--muted2);font-size:7px}
.conversation{min-width:0;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;background:radial-gradient(circle at 45% -25%,rgba(117,230,195,.055),transparent 37%),var(--bg)}.conversation-header{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 22px 8px}.conversation-header>div:first-child>span{color:var(--mint);font-size:8px;font-weight:800;letter-spacing:.14em}.conversation-header h1{margin:4px 0 3px;font-size:18px}.conversation-header p{margin:0;color:var(--muted2);font-size:8px}.header-actions{display:flex;align-items:center;gap:10px}.write-mode{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:7px 9px}.write-mode span strong,.write-mode span small{display:block}.write-mode strong{font-size:8px}.write-mode small{margin-top:2px;color:var(--muted2);font-size:7px}.write-mode input{display:none}.write-mode>i{position:relative;width:28px;height:16px;border-radius:10px;background:#303744}.write-mode>i:after{content:"";position:absolute;top:3px;left:3px;width:10px;height:10px;border-radius:50%;background:#8791a2;transition:.2s}.write-mode input:checked+i{background:rgba(117,230,195,.28)}.write-mode input:checked+i:after{left:15px;background:var(--mint)}.status-chip{border:1px solid var(--line);border-radius:20px;padding:7px 10px;color:var(--muted);font-size:8px}.status-chip.running{border-color:rgba(117,230,195,.2);background:rgba(117,230,195,.1);color:var(--mint)}.view-tabs{width:max-content;display:flex;gap:3px;border:1px solid var(--line);border-radius:10px;margin:3px 22px 8px;padding:3px}.view-tabs button{min-height:28px;border:0;border-radius:7px;background:transparent;padding:0 11px;color:var(--muted);font-size:8px}.view-tabs button.active{background:rgba(117,230,195,.11);color:var(--mint)}.view-tabs span{color:var(--muted2)}.tab-panel{min-height:0}.chat-panel{position:relative;overflow:hidden}.chat-scroll{height:100%;overflow:auto}.chat-empty{height:100%;display:grid;place-content:center;justify-items:center;text-align:center;color:var(--muted2)}.chat-empty h2{margin:18px 0 5px;color:var(--text);font-size:16px}.chat-empty p{margin:0;font-size:9px}.chat-empty code{color:var(--mint)}.triad-symbol{position:relative;width:65px;height:54px}.triad-symbol i{position:absolute;width:13px;height:13px;border-radius:50%}.triad-symbol i:nth-child(1){top:0;left:26px;background:var(--mint)}.triad-symbol i:nth-child(2){bottom:0;left:4px;background:var(--violet)}.triad-symbol i:nth-child(3){right:4px;bottom:0;background:var(--amber)}.messages{width:min(860px,calc(100% - 36px));display:grid;gap:15px;margin:auto;padding:22px 0 32px}.message{display:grid;grid-template-columns:34px 1fr;gap:11px}.message-avatar{display:grid;width:32px;height:32px;place-items:center;border:1px solid var(--line);border-radius:9px;background:var(--panel2);color:var(--mint);font-size:8px;font-weight:800}.message.claude .message-avatar{color:var(--violet)}.message.antigravity .message-avatar{color:var(--amber)}.message.user .message-avatar{color:#9fc8ff}.message>div{min-width:0;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.018);padding:11px 13px}.message.user>div{background:rgba(91,143,211,.06)}.message header{display:flex;justify-content:space-between;gap:10px}.message header strong{font-size:10px}.message header small{color:var(--muted2);font-size:7px}.message p{margin:9px 0 0;color:#c8ced8;font-size:11px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}.live-run{position:absolute;z-index:5;top:8px;left:50%;width:min(760px,calc(100% - 36px));display:flex;align-items:center;justify-content:space-between;transform:translateX(-50%);border:1px solid rgba(117,230,195,.2);border-radius:11px;background:rgba(255,255,255,.96);padding:9px 12px;box-shadow:0 16px 50px #0007}.live-run>div{display:flex;align-items:center;gap:10px}.live-run i{width:8px;height:8px;border-radius:50%;background:var(--mint);animation:pulse 1.4s infinite}.live-run small,.live-run strong{display:block}.live-run small{color:var(--mint);font-size:7px}.live-run strong{margin-top:2px;font-size:9px}.live-run button{border:1px solid rgba(255,127,135,.25);border-radius:7px;background:rgba(255,127,135,.1);padding:6px 9px;color:var(--red);font-size:8px}
.composer{border-top:1px solid var(--line);background:var(--panel);padding:9px 20px 13px}.mention-row{display:flex;align-items:center;gap:6px;margin-bottom:7px}.mention-row button{border:1px solid var(--line);border-radius:7px;background:rgba(255,255,255,.025);padding:5px 8px;color:var(--muted);font-size:8px}.mention-row button:first-child{border-color:rgba(117,230,195,.18);color:var(--mint)}.mention-row .debate{border-color:rgba(255,189,115,.18);color:var(--amber)}.mention-row span{margin-left:auto;color:var(--muted2);font-size:7px}.composer-row{display:grid;grid-template-columns:1fr auto;gap:8px}.composer textarea{min-height:58px;max-height:180px;resize:vertical;border:1px solid var(--line2);border-radius:11px;background:var(--panel2);padding:11px 13px;color:var(--text);font-size:11px;line-height:1.5;outline:0}.composer textarea:focus{border-color:rgba(117,230,195,.35)}.composer-row button{width:72px;border:1px solid var(--line);border-radius:10px}.composer-row button:disabled{opacity:.45}
.agent-drawer{min-width:0;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;border-left:1px solid var(--line);background:var(--panel2);padding:18px 12px 12px}.agent-drawer>header strong{border:1px solid var(--line);border-radius:12px;padding:5px 8px;color:var(--muted2);font-size:7px}.agent-policy{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.02);padding:10px}.agent-policy span strong,.agent-policy span small{display:block}.agent-policy strong{font-size:8px}.agent-policy small{margin-top:3px;color:var(--muted2);font-size:7px}.agent-list{display:grid;align-content:start;gap:8px;overflow:auto;padding:12px 0}.agent-card{border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.018);padding:10px}.agent-card.running,.agent-card.queued{border-color:rgba(117,230,195,.2)}.agent-heading{display:grid;grid-template-columns:30px 1fr 7px;align-items:center;gap:8px}.agent-heading>span{display:grid;width:30px;height:30px;place-items:center;border-radius:8px;background:rgba(117,230,195,.1);color:var(--mint);font-size:8px;font-weight:800}.agent-card.claude .agent-heading>span{background:rgba(173,156,255,.1);color:var(--violet)}.agent-card.antigravity .agent-heading>span{background:rgba(255,189,115,.1);color:var(--amber)}.agent-heading strong,.agent-heading small{display:block}.agent-heading strong{font-size:9px}.agent-heading small{margin-top:3px;color:var(--muted2);font-size:7px}.agent-heading>i{width:6px;height:6px;border-radius:50%;background:#404a58}.agent-card.running .agent-heading>i,.agent-card.queued .agent-heading>i{background:var(--mint);box-shadow:0 0 0 4px rgba(117,230,195,.09)}.agent-card p{height:30px;overflow:hidden;margin:9px 0;color:var(--muted);font-size:8px;line-height:1.7}.agent-progress{height:2px;border-radius:2px;background:#1c2430}.agent-progress b{display:block;height:100%;background:var(--mint);transition:.3s}.agent-drawer>footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:11px 3px 0;color:var(--muted2);font-size:7px}.agent-drawer>footer strong{color:var(--mint)}
.activity-panel{overflow:auto;padding:12px 22px 24px}.activity-panel>header{padding-left:0}.activity-list{display:grid;gap:8px}.activity-item{display:grid;grid-template-columns:34px 1fr;gap:11px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.018);padding:10px}.activity-avatar{display:grid;width:32px;height:32px;place-items:center;border-radius:8px;background:var(--panel2);color:var(--mint);font-size:8px}.activity-item header{display:flex;justify-content:space-between}.activity-item strong{font-size:9px}.activity-item em{color:var(--muted);font-size:7px;font-style:normal}.activity-item p{margin:6px 0;color:var(--muted);font-size:9px}.activity-item small{color:var(--muted2);font-size:7px}.record-empty{color:var(--muted2);font-size:10px}
.admin-panel{overflow:auto;padding:14px 22px 24px}.admin-panel>header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.admin-panel>header span{color:var(--mint);font-size:8px;font-weight:800;letter-spacing:.15em}.admin-panel h2{margin:4px 0;font-size:18px}.admin-panel p{margin:0;color:var(--muted2);font-size:9px}.admin-panel button,.admin-panel input,.admin-panel select{border:1px solid var(--line);border-radius:7px;background:var(--panel2);padding:7px 9px;font-size:9px}.admin-create{display:grid;grid-template-columns:minmax(130px,1fr) minmax(200px,1.4fr) 130px auto;gap:8px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.018);padding:11px}.admin-table-wrap{overflow:auto;margin-top:12px;border:1px solid var(--line);border-radius:11px}.admin-table{width:100%;border-collapse:collapse;font-size:9px}.admin-table th,.admin-table td{border-bottom:1px solid var(--line);padding:10px;text-align:left}.admin-table th{background:var(--panel);color:var(--muted);font-size:8px}.admin-table tr:last-child td{border-bottom:0}.admin-table td:first-child{display:flex;align-items:center;gap:8px}.admin-table td:first-child span strong,.admin-table td:first-child span small{display:block}.admin-table td:first-child small{max-width:150px;overflow:hidden;text-overflow:ellipsis;margin-top:3px;color:var(--muted2);font:7px ui-monospace,monospace}.admin-avatar{display:grid!important;width:29px;height:29px;place-items:center;border-radius:8px;background:rgba(117,230,195,.1);color:var(--mint);font-size:8px}.account-status.active{color:var(--mint);border-color:rgba(117,230,195,.25)}.account-status.disabled{color:var(--red);border-color:rgba(255,127,135,.25)}.admin-panel button:disabled,.admin-panel select:disabled{cursor:not-allowed;opacity:.45}
#toast{position:fixed;z-index:200;left:50%;bottom:18px;transform:translate(-50%,20px);opacity:0;border:1px solid var(--line2);border-radius:9px;background:var(--panel);padding:9px 13px;color:var(--text);font-size:9px;transition:.2s;pointer-events:none}#toast.visible{transform:translate(-50%,0);opacity:1}#toast.error{border-color:rgba(255,127,135,.3);color:var(--red)}@keyframes pulse{50%{opacity:.45;transform:scale(.85)}}
@media(max-width:1100px){.workspace-shell{grid-template-columns:220px minmax(430px,1fr)}.agent-drawer{display:none}}@media(max-width:760px){body{overflow:auto}.titlebar{grid-template-columns:100px 1fr}.titlebar-context{display:none}.sidebar{display:none}.workspace-shell{position:fixed;inset:42px 0 0;grid-template-columns:1fr}.project-rail{display:none}.conversation-header{padding-inline:14px}.conversation-header p,.mention-row span{display:none}.header-actions{align-self:flex-start}.view-tabs{margin-inline:14px}.composer{padding-inline:12px}.mention-row{overflow:auto}.messages{width:calc(100% - 24px)}.admin-create{grid-template-columns:1fr}.admin-panel{padding-inline:10px}}

/* Readability pass: keep information dense without reducing text to dashboard-scale labels. */
body {
  font-size: 14px;
}

.titlebar {
  height: 52px;
  grid-template-columns: 200px minmax(300px, 640px) 1fr;
  padding-inline: 20px;
}

.titlebar-product,
.titlebar-command {
  font-size: 12px;
}

.titlebar-context {
  font-size: 11px;
}

.sidebar {
  inset-block-start: 52px;
  width: 80px;
}

.side-item {
  width: 56px;
  min-height: 58px;
  gap: 3px;
}

.side-item small {
  display: block;
  font-size: 9px;
}

.workspace-shell {
  inset: 52px 0 0 80px;
  grid-template-columns: 280px minmax(560px, 1fr) 340px;
}

.project-rail,
.agent-drawer {
  padding: 22px 16px 16px;
}

.project-rail h2,
.agent-drawer h2,
.activity-panel h2 {
  font-size: 20px;
}

.project-item {
  min-height: 64px;
  grid-template-columns: 38px minmax(0, 1fr) 7px;
  gap: 11px;
  padding: 10px;
}

.project-icon {
  width: 38px;
  height: 38px;
  font-size: 10px;
}

.project-item strong,
.project-rail footer strong {
  font-size: 12px;
}

.project-item small,
.project-rail footer small,
.rail-files header,
.rail-files > div {
  font-size: 10px;
}

.conversation-header {
  min-height: 96px;
  padding: 18px 28px 12px;
}

.conversation-header h1 {
  font-size: 22px;
}

.conversation-header p,
.write-mode strong,
.status-chip,
.view-tabs button {
  font-size: 11px;
}

.write-mode small,
.conversation-header > div:first-child > span {
  font-size: 9px;
}

.view-tabs {
  margin: 4px 28px 10px;
}

.view-tabs button {
  min-height: 34px;
  padding-inline: 14px;
}

.messages {
  width: min(1080px, calc(100% - 48px));
  gap: 18px;
  padding-block: 28px 42px;
}

.message {
  grid-template-columns: 40px 1fr;
  gap: 13px;
}

.message-avatar {
  width: 38px;
  height: 38px;
  font-size: 10px;
}

.message > div {
  border-radius: 15px;
  padding: 14px 16px;
}

.message header strong {
  font-size: 12px;
}

.message header small {
  font-size: 10px;
}

.message p {
  font-size: 14px;
  line-height: 1.72;
}

.chat-empty h2 {
  font-size: 22px;
}

.chat-empty p {
  font-size: 12px;
}

.starter-actions {
  display: flex;
  gap: 8px;
  margin-top: 22px;
}

.starter-actions button {
  border: 1px solid var(--line2);
  border-radius: 9px;
  background: var(--panel);
  padding: 9px 12px;
  color: var(--muted);
  font-size: 11px;
}

.starter-actions button:first-child {
  border-color: rgba(117, 230, 195, .28);
  color: var(--mint);
}

.project-empty {
  min-height: 100%;
  display: grid;
  place-content: center;
  justify-items: center;
  padding: 32px;
  color: var(--muted);
  text-align: center;
}

.project-empty h2 { margin: 18px 0 7px; color: var(--text); font-size: 22px; }
.project-empty p { max-width: 540px; margin: 0; font-size: 12px; line-height: 1.65; }
.project-empty button { margin-top: 22px; border: 1px solid #087f67; border-radius: 10px; padding: 10px 16px; font-size: 12px; font-weight: 800; }
.project-list-empty { margin: 8px 7px; border: 1px dashed var(--line2); border-radius: 10px; padding: 13px 10px; color: var(--muted2); font-size: 10px; line-height: 1.55; }

.project-list-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  align-items: center;
  gap: 4px;
}

.project-list-row .project-item { min-width: 0; }

.project-remove {
  width: 28px;
  height: 28px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--muted2);
  font-size: 16px;
  line-height: 1;
}

.project-remove:hover,
.project-remove:focus-visible {
  border-color: rgba(194, 65, 65, .2);
  background: #fff0f0;
  color: #b42318;
}
.project-rail button:disabled,
.view-tabs button:disabled { cursor: not-allowed; opacity: .38; transform: none; }

.composer {
  padding: 12px 26px 18px;
}

.mention-row button,
.mention-row span {
  font-size: 10px;
}

.composer textarea {
  min-height: 72px;
  padding: 14px 16px;
  font-size: 14px;
}

.composer-row button {
  width: 88px;
  font-size: 12px;
}

.agent-policy strong,
.agent-heading strong {
  font-size: 11px;
}

.agent-policy small,
.agent-heading small,
.agent-drawer > header strong,
.agent-drawer > footer {
  font-size: 9px;
}

.agent-card {
  padding: 13px;
}

.agent-card p {
  height: 40px;
  font-size: 11px;
}

.workflows-panel {
  overflow: auto;
  padding: 16px 28px 32px;
}

.workflows-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}

.workflows-panel > header span,
.workflow-history-heading span {
  color: var(--mint);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .16em;
}

.workflows-panel h2,
.workflow-history-heading h3 {
  margin: 5px 0;
}

.workflows-panel > header p,
.workflow-card p,
.workflow-run p,
.workflow-run small {
  color: var(--muted);
}

.workflows-panel > header p {
  margin: 0;
  font-size: 12px;
}

.workflows-panel button {
  border: 1px solid var(--line2);
  border-radius: 8px;
  background: var(--panel2);
  padding: 8px 11px;
  font-size: 11px;
}

.workflow-definitions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}

.workflow-card {
  display: grid;
  min-height: 190px;
  grid-template-rows: auto auto 1fr auto;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(117, 230, 195, .04), rgba(255, 255, 255, .015));
  padding: 16px;
}

.workflow-card header,
.workflow-card footer,
.workflow-run header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.titlebar-command {
  position: relative;
}

.titlebar-command input[type="search"] {
  min-width: 0;
  flex: 1;
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--text);
  font-size: 11px;
  outline: 0;
}

.titlebar-command input[type="search"]:not(:placeholder-shown) + #title-project,
.titlebar-command input[type="search"]:focus + #title-project {
  display: none;
}

.message-search-results {
  position: absolute;
  z-index: 30;
  top: calc(100% + 9px);
  left: 0;
  right: 0;
  display: grid;
  max-height: min(520px, 70vh);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #111720;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .45);
  padding: 6px;
}

.message-search-results button {
  display: grid;
  gap: 3px;
  width: 100%;
  border: 0;
  border-radius: 8px;
  background: transparent;
  padding: 9px 10px;
  text-align: left;
}

.message-search-results button:hover { background: rgba(117, 230, 195, .08); }
.message-search-results strong { color: var(--mint); font-size: 10px; }
.message-search-results span { overflow: hidden; color: var(--text); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.message-search-results small, .message-search-results p { color: var(--muted2); font-size: 9px; }

.activity-item { cursor: pointer; }
.activity-item pre {
  max-height: 220px;
  overflow: auto;
  margin: 10px 0 0;
  border-radius: 8px;
  background: #070a0f;
  padding: 10px;
  color: #bdc8d3;
  font: 9px/1.6 ui-monospace, monospace;
  white-space: pre-wrap;
}

.agent-model {
  width: 100%;
  margin: 0 0 10px;
  border-color: rgba(117, 230, 195, .16);
  background: rgba(0, 0, 0, .16);
  padding: 6px 8px;
  color: var(--muted);
  font-size: 9px;
}

.workflow-card header span {
  color: var(--mint);
  font-size: 12px;
  font-weight: 700;
}

.workflow-card header small,
.workflow-card footer em {
  color: var(--muted2);
  font-size: 9px;
  font-style: normal;
}

.workflow-card h3 {
  margin: 16px 0 8px;
  font-size: 15px;
  letter-spacing: .06em;
}

.workflow-card p {
  margin: 0 0 18px;
  font-size: 11px;
  line-height: 1.6;
}

.workflow-card footer button {
  border-color: rgba(117, 230, 195, .24);
  color: var(--mint);
}

.workflow-history-heading {
  margin: 28px 0 12px;
}

.workflow-history {
  display: grid;
  gap: 9px;
}

.workflow-run {
  display: grid;
  grid-template-columns: 38px 1fr;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, .018);
  padding: 12px;
}

.workflow-run-icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 10px;
  background: rgba(117, 230, 195, .1);
  color: var(--mint);
  font-weight: 800;
}

.workflow-run em {
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
}

.workflow-run p {
  margin: 5px 0 8px;
  font-size: 11px;
}

.workflow-run small {
  font-size: 9px;
}

.workflow-run-progress {
  height: 3px;
  overflow: hidden;
  border-radius: 3px;
  background: #1c2430;
  margin-bottom: 7px;
}

.workflow-run-progress i {
  display: block;
  height: 100%;
  background: var(--mint);
}

.workflow-run.failed .workflow-run-progress i,
.workflow-run.cancelled .workflow-run-progress i {
  background: var(--red);
}

@media (max-width: 1280px) {
  .workspace-shell {
    grid-template-columns: 250px minmax(500px, 1fr);
  }

  .agent-drawer {
    display: none;
  }
}

@media (max-width: 760px) {
  .workspace-shell {
    inset: 52px 0 0;
    grid-template-columns: 1fr;
  }

  .conversation-header {
    padding-inline: 16px;
  }

  .messages {
    width: calc(100% - 28px);
  }

  .starter-actions {
    flex-wrap: wrap;
    justify-content: center;
  }
}

/* Safe Markdown chat content */
.markdown-body{min-width:0;color:inherit;line-height:1.65;overflow-wrap:anywhere}
.markdown-body>:first-child{margin-top:0}.markdown-body>:last-child{margin-bottom:0}
.markdown-body p,.markdown-body ul,.markdown-body ol,.markdown-body blockquote,.markdown-body pre,.markdown-table-scroll{margin:10px 0}
.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4{margin:18px 0 8px;color:#172554;line-height:1.3}
.markdown-body h1{font-size:1.45rem}.markdown-body h2{font-size:1.25rem}.markdown-body h3{font-size:1.1rem}
.markdown-body ul,.markdown-body ol{padding-left:24px}.markdown-body li+li{margin-top:4px}
.markdown-body blockquote{border-left:4px solid #60a5fa;background:#eff6ff;padding:10px 14px;border-radius:0 10px 10px 0;color:#334155}
.markdown-body code{font-family:"SFMono-Regular",Consolas,monospace;background:#e8eef8;border:1px solid #d4deed;border-radius:5px;padding:1px 5px;font-size:.9em}
.markdown-body pre{max-width:100%;overflow:auto;background:#111827;color:#e5edf8;border-radius:11px;padding:14px}
.markdown-body pre code{background:transparent;border:0;padding:0;color:inherit;white-space:pre}
.markdown-table-scroll{max-width:100%;overflow-x:auto;border:1px solid #dbe4f0;border-radius:10px;background:#fff;-webkit-overflow-scrolling:touch}
.markdown-body table{width:max-content;min-width:100%;border-collapse:collapse;background:#fff}
.markdown-body th,.markdown-body td{max-width:520px;border:1px solid #dbe4f0;padding:9px 11px;text-align:left;vertical-align:top;white-space:normal}.markdown-body th{background:#eff6ff;color:#1e3a8a}.markdown-body tbody tr:nth-child(even){background:#f8fafc}
.markdown-body img{display:block;max-width:100%;max-height:560px;margin:12px auto;border:1px solid #dbe4f0;border-radius:12px;background:#f8fafc;object-fit:contain}
.markdown-body a{color:#1d4ed8;text-decoration:underline;text-underline-offset:2px}
.markdown-file-link{display:inline;border:0;background:transparent;padding:0;color:#1d4ed8;font:inherit;font-weight:700;text-decoration:underline;text-underline-offset:2px;cursor:pointer}.markdown-file-link:hover{color:#1e40af}.markdown-file-link:focus-visible{outline:2px solid #60a5fa;outline-offset:3px;border-radius:3px}

/* Office document authoring */
.document-studio{margin:16px;border:1px solid var(--border);border-radius:16px;background:linear-gradient(135deg,#fff 0%,#f5f9ff 100%);box-shadow:0 12px 34px rgba(37,99,235,.08);padding:18px}
.document-studio>header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:16px}
.document-studio>header span,.document-studio-grid>article>small{color:#2563eb;font-size:.72rem;font-weight:800;letter-spacing:.12em}
.document-studio>header h2{margin:3px 0 4px}.document-studio>header p{margin:0;color:var(--muted)}
.document-studio>header>div:last-child{display:flex;gap:8px;align-items:center}
.document-studio-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:12px}
.document-studio-grid label{display:grid;gap:6px;font-weight:700;color:#334155}.document-studio-grid label:first-child{grid-column:1}
.document-body-label{grid-column:1}.document-studio-grid input,.document-studio-grid textarea{width:100%;border:1px solid #cbd5e1;border-radius:10px;background:#fff;color:#172554;padding:11px 12px;resize:vertical}
.document-studio-grid>article{grid-column:2;grid-row:1/3;min-height:320px;background:#fff;border:1px solid #dbe4f0;border-radius:12px;padding:16px;overflow:auto}
.document-preview{margin-top:12px}

/* Admin-only OAuth reconnect */
.oauth-reconnect{margin:0 0 18px;border:1px solid var(--border);border-radius:14px;background:#f8fbff;padding:16px}
.oauth-reconnect>header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}.oauth-reconnect>header h3{margin:3px 0}.oauth-reconnect>header p{margin:0;color:var(--muted)}
.oauth-reconnect>header em{font-style:normal;font-size:.72rem;font-weight:800;color:#1d4ed8;background:#dbeafe;border-radius:999px;padding:6px 10px}
.oauth-provider-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.oauth-provider{display:flex;justify-content:space-between;gap:10px;align-items:center;background:#fff;border:1px solid #dbe4f0;border-radius:11px;padding:12px}.oauth-provider.ready{border-color:#bbf7d0}.oauth-provider.disconnected{border-color:#fed7aa}
.oauth-provider div{min-width:0;display:grid;gap:2px}.oauth-provider small{color:var(--muted)}.oauth-provider p{margin:4px 0 0;color:#64748b;font-size:.75rem;line-height:1.35;max-height:3.2em;overflow:auto}
.mcp-setup{margin:0 0 18px;border:1px solid var(--border);border-radius:14px;background:#f8fbff;padding:16px}.mcp-setup>header{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.mcp-setup>header span{color:#2563eb;font-size:.72rem;font-weight:800;letter-spacing:.12em}.mcp-setup>header h3{margin:3px 0}.mcp-setup>header p,.mcp-scope,.mcp-setup>footer p{margin:0;color:var(--muted);line-height:1.5}.mcp-setup>header em{font-style:normal;font-size:.72rem;font-weight:800;color:#1d4ed8;background:#dbeafe;border-radius:999px;padding:6px 10px}.mcp-scope{margin-top:10px!important;padding:9px 11px;border-radius:9px;background:#eef4ff}.mcp-provider-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}.mcp-provider-list article{min-width:0;border:1px solid #dbe4f0;border-radius:11px;background:#fff;padding:12px}.mcp-provider-list strong{display:block}.mcp-provider-list p{min-height:3.4em;margin:5px 0 9px!important;line-height:1.45}.mcp-provider-list code{display:block;overflow:auto;border-radius:7px;background:#eef2f7;padding:8px;color:#334155;font-size:.72rem;white-space:nowrap}.mcp-setup>footer{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:12px}.mcp-setup>footer p{max-width:760px}.mcp-setup>footer button{white-space:nowrap}

@media(max-width:900px){.document-studio>header{display:grid}.document-studio-grid{grid-template-columns:1fr}.document-studio-grid>article{grid-column:1;grid-row:auto}.oauth-provider-list,.mcp-provider-list{grid-template-columns:1fr}.mcp-provider-list p{min-height:0}.mcp-setup>footer{align-items:stretch;flex-direction:column}}

.upload-artifact {
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--panel2);
  padding: 6px 9px;
  font-size: 9px;
}

.upload-artifact {
  cursor: pointer;
}

.upload-artifact input {
  display: none;
}

/* Git is intentionally a review surface: no remotes, arbitrary commands, or hidden actions. */
.git-panel {
  overflow: auto;
  padding: 16px 28px 32px;
}

.git-panel > header,
.git-changes > header,
.git-diff > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.git-panel > header span,
.git-layout header span {
  color: var(--mint);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .16em;
}

.git-panel h2,
.git-panel h3 {
  margin: 5px 0;
}

.git-panel > header p,
.git-note {
  margin: 0;
  color: var(--muted2);
  font-size: 11px;
  line-height: 1.6;
}

.git-panel button,
.git-panel input {
  border: 1px solid var(--line2);
  border-radius: 8px;
  background: var(--panel2);
  padding: 8px 11px;
  font-size: 11px;
}

.git-overview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0 12px;
}

.git-overview article,
.git-changes,
.git-diff {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, .018);
}

.git-overview article {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 14px;
}

.git-overview small {
  color: var(--muted2);
  font-size: 9px;
  letter-spacing: .1em;
}

.git-overview strong {
  overflow: hidden;
  color: var(--text);
  font: 12px ui-monospace, monospace;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#git-clean.clean {
  color: var(--mint);
}

.git-layout {
  display: grid;
  grid-template-columns: minmax(250px, .72fr) minmax(360px, 1.28fr);
  gap: 12px;
}

.git-changes,
.git-diff {
  min-width: 0;
  overflow: hidden;
  padding: 14px;
}

.git-layout header label {
  color: var(--muted);
  font-size: 10px;
}

.git-layout header input {
  padding: 0;
}

#git-change-list {
  display: grid;
  gap: 7px;
  max-height: 360px;
  overflow: auto;
  margin-top: 12px;
}

.git-change {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
}

.git-change > span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 7px;
  background: rgba(117, 230, 195, .1);
  color: var(--mint);
  font-size: 9px;
  font-weight: 800;
}

.git-change strong,
.git-change small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.git-change strong {
  font: 10px ui-monospace, monospace;
}

.git-change small {
  margin-top: 3px;
  color: var(--muted2);
  font-size: 8px;
}

#git-diff-content {
  min-height: 280px;
  max-height: 360px;
  overflow: auto;
  margin: 12px 0 0;
  border-radius: 8px;
  background: #070a0f;
  padding: 12px;
  color: #bdc8d3;
  font: 10px/1.6 ui-monospace, monospace;
  white-space: pre-wrap;
}

.git-commit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  margin-top: 12px;
}

.git-commit button:disabled {
  cursor: not-allowed;
  opacity: .45;
}

.git-note {
  margin-top: 9px;
}

@media (max-width: 900px) {
  .git-overview,
  .git-layout {
    grid-template-columns: 1fr;
  }

  .git-panel {
    padding-inline: 12px;
  }
}

/* General-mode output creation and dhkim's approval inbox are first-class work areas. */
.auth-help { color: var(--muted2); font-size: 10px; line-height: 1.5; }
.auth-help b { color: var(--mint); }

.output-shortcuts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.output-shortcuts button {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 3px 10px;
  border: 1px solid rgba(117, 230, 195, .14);
  border-radius: 12px;
  background: rgba(117, 230, 195, .045);
  padding: 12px;
  text-align: left;
}

.output-shortcuts button > span {
  grid-row: 1 / 3;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 9px;
  background: rgba(117, 230, 195, .12);
  color: var(--mint);
  font-size: 8px;
  font-weight: 800;
}

.output-shortcuts strong { font-size: 11px; }
.output-shortcuts small { color: var(--muted2); font-size: 9px; }
.registrations-panel {
  overflow: auto;
  padding: 14px 22px 24px;
}

.registrations-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.registrations-panel > header span {
  color: var(--mint);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .15em;
}

.registrations-panel h2 { margin: 4px 0; font-size: 18px; }
.registrations-panel p { margin: 0; color: var(--muted2); font-size: 9px; }
.registrations-panel button { border: 1px solid var(--line); border-radius: 7px; background: var(--panel2); padding: 7px 9px; font-size: 9px; }
.registrations-panel td:last-child { display: flex; gap: 6px; }

@media (max-width: 760px) {
  .output-shortcuts { grid-template-columns: 1fr; }
  .registrations-panel { padding-inline: 10px; }
}

/* One project is one chat, so its harness is edited and persisted in this panel. */
.harness-panel { overflow: auto; padding: 16px 28px 36px; }
#harness-form { display: grid; gap: 14px; }
.harness-hero,
.harness-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.harness-hero { border: 1px solid rgba(117,230,195,.16); border-radius: 14px; background: linear-gradient(135deg,rgba(117,230,195,.055),rgba(173,156,255,.025)); padding: 18px; }
.harness-hero span,
.harness-heading span { color: var(--mint); font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.harness-hero h2,
.harness-heading h3 { margin: 5px 0; }
.harness-hero p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.harness-actions { display: flex; align-items: end; gap: 8px; }
.harness-actions label { min-width: 150px; }
.harness-panel label { display: grid; gap: 6px; color: var(--muted); font-size: 10px; }
.harness-panel button,
.harness-panel select,
.harness-panel input,
.harness-panel textarea { border: 1px solid var(--line2); border-radius: 8px; background: #0a0f16; padding: 8px 10px; color: var(--text); font-size: 11px; }
.harness-panel textarea { width: 100%; resize: vertical; line-height: 1.55; }
.harness-section { display: grid; gap: 12px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.018); padding: 16px; }
.harness-heading strong { border: 1px solid rgba(117,230,195,.2); border-radius: 20px; padding: 6px 9px; color: var(--mint); font-size: 9px; }
.harness-agent-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.harness-agent-grid article { min-width: 0; overflow: hidden; display: grid; gap: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); padding: 12px; }
.harness-agent-grid article.disabled { opacity: .55; }
.harness-agent-grid article > header { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 9px; }
.harness-agent-grid article > header > span { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 9px; background: rgba(117,230,195,.1); color: var(--mint); font-size: 9px; font-weight: 800; }
.harness-agent-grid article:nth-child(2) > header > span { background: rgba(173,156,255,.1); color: var(--violet); }
.harness-agent-grid article:nth-child(3) > header > span { background: rgba(255,189,115,.1); color: var(--amber); }
.harness-agent-grid article header strong,
.harness-agent-grid article header small { display: block; }
.harness-agent-grid article header strong { font-size: 11px; }
.harness-agent-grid article header small { margin-top: 3px; color: var(--muted2); font-size: 9px; }
.mini-toggle { position: relative; display: block!important; width: 34px; height: 20px; }
.mini-toggle input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.mini-toggle i { position: absolute; inset: 0; border: 1px solid var(--line2); border-radius: 12px; background: #2a3240; transition: .16s; }
.mini-toggle i::after { position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; border-radius: 50%; background: #8791a2; content: ""; transition: .16s; }
.mini-toggle input:checked + i { border-color: rgba(117,230,195,.4); background: rgba(117,230,195,.25); }
.mini-toggle input:checked + i::after { transform: translateX(14px); background: var(--mint); }
.harness-runtime-grid { display: grid; grid-template-columns: repeat(5,minmax(120px,1fr)); gap: 9px; }
.toggle-control { display: flex!important; align-items: center; justify-content: space-between; border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; }
.toggle-control span:first-child strong,
.toggle-control span:first-child small { display: block; }
.toggle-control small { margin-top: 3px; color: var(--muted2); font-size: 8px; }
.harness-copy-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.harness-locked { margin: 0; border-left: 2px solid var(--mint); padding-left: 10px; color: var(--muted2); font-size: 9px; line-height: 1.55; }
.project-capabilities-section { margin-top: 18px; }
.project-capability-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.project-capability-grid > section { min-width: 0; }
.project-capability-grid h4 { margin: 0 0 8px; }
.project-capability-list { display: grid; gap: 8px; }
.project-capability-item { display: grid; gap: 9px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); transition: border-color .16s,background .16s; }
.project-capability-item.selected { border-color: rgba(117,230,195,.36); background: rgba(117,230,195,.07); }
.project-capability-item > label { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 10px; align-items: start; cursor: pointer; }
.project-capability-item input { margin-top: 3px; }
.project-capability-item label span { min-width: 0; display: grid; gap: 3px; }
.project-capability-item small { overflow-wrap: anywhere; color: var(--muted); }
.project-capability-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding-left: 24px; }
.capability-badge,.capability-connection,.capability-checked-at { border: 1px solid var(--line); border-radius: 999px; padding: 3px 7px; color: var(--muted); font-size: 9px; }
.capability-badge.price-free { border-color: rgba(117,230,195,.3); color: var(--mint); }
.capability-badge.price-freemium { border-color: rgba(255,189,115,.35); color: var(--amber); }
.capability-badge.price-paid { border-color: rgba(173,156,255,.35); color: var(--violet); }
.capability-connection { color: var(--text); }
.project-capability-meta a { color: var(--mint); font-size: 9px; text-decoration: none; }
.capability-pricing-note,.capability-cost-scope { margin: 0; color: var(--muted2); font-size: 10px; line-height: 1.55; }
.capability-pricing-note { padding-left: 24px; }
.capability-cost-scope { border-left: 2px solid var(--amber); padding: 7px 9px; background: rgba(255,189,115,.05); }
.capability-marketplace-section { margin-top: 18px; }
.capability-marketplace-warning { margin: 0; border-left: 3px solid var(--amber); background: rgba(255,189,115,.07); padding: 9px 11px; color: var(--muted); font-size: 10px; line-height: 1.55; }
.capability-marketplace-search { display: grid; grid-template-columns: 130px minmax(180px,1fr) auto; align-items: end; gap: 9px; }
.capability-marketplace-search label { display: grid; gap: 5px; color: var(--muted); font-size: 9px; font-weight: 700; }
.capability-marketplace-search input,
.capability-marketplace-search select { width: 100%; min-height: 36px; }
.capability-marketplace-results { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; max-height: 520px; min-height: 56px; overflow: auto; overscroll-behavior: contain; padding-right: 3px; }
.capability-marketplace-card { display: grid; align-content: start; gap: 8px; min-width: 0; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-soft); padding: 11px; }
.capability-marketplace-heading,
.capability-marketplace-actions { display: flex; align-items: flex-start; justify-content: space-between; gap: 9px; }
.capability-marketplace-heading h4 { margin: 2px 0 0; overflow-wrap: anywhere; }
.capability-marketplace-source { color: var(--blue); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.capability-marketplace-card > p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.capability-marketplace-meta { display: flex; flex-wrap: wrap; gap: 5px; }
.capability-marketplace-meta span { border: 1px solid var(--line); border-radius: 999px; padding: 3px 7px; color: var(--muted2); font-size: 8px; }
.capability-marketplace-actions { align-items: center; margin-top: auto; }
.capability-marketplace-actions a { color: var(--blue); font-size: 9px; text-decoration: none; }
.capability-marketplace-actions button { min-height: 32px; }
.agent-card.disabled { opacity: .5; }
.mention-row button:disabled { cursor: not-allowed; opacity: .35; }

@media (max-width: 980px) {
  .harness-agent-grid,
  .harness-copy-grid { grid-template-columns: 1fr; }
  .harness-runtime-grid { grid-template-columns: repeat(2,minmax(120px,1fr)); }
  .harness-hero { align-items: stretch; flex-direction: column; }
}

@media (max-width: 760px) {
  .project-capability-grid { grid-template-columns: 1fr; }
  .capability-marketplace-search,
  .capability-marketplace-results { grid-template-columns: 1fr; }
  .capability-marketplace-results { max-height: 420px; }
  .harness-panel { padding-inline: 10px; }
  .harness-runtime-grid { grid-template-columns: 1fr; }
  .harness-actions { align-items: stretch; flex-direction: column; }
}

/* The application shell owns the viewport. Only the active conversation body scrolls. */
.conversation { height: 100%; min-height: 0; overflow: hidden; }
.conversation > .tab-panel { min-height: 0; }
.chat-panel { display: grid; grid-template-rows: auto minmax(0, 1fr); min-height: 0; }
.chat-scroll {
  min-width: 0;
  min-height: 0;
  height: auto;
  overflow-x: hidden;
  overflow-y: scroll;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: rgba(117,230,195,.36) rgba(255,255,255,.035);
}
.chat-scroll::-webkit-scrollbar { width: 11px; }
.chat-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,.025); }
.chat-scroll::-webkit-scrollbar-thumb { border: 3px solid var(--bg); border-radius: 10px; background: rgba(117,230,195,.38); }
.messages { min-height: 100%; align-content: end; }
.chat-bottom {
  position: absolute;
  z-index: 8;
  right: 24px;
  bottom: 18px;
  border: 1px solid rgba(117,230,195,.32);
  border-radius: 999px;
  background: rgba(255,255,255,.96);
  padding: 8px 12px;
  color: var(--mint);
  font-size: 10px;
  box-shadow: 0 10px 30px rgba(31,45,64,.16);
}

.debate-board {
  display: grid;
  gap: 8px;
  border-block: 1px solid rgba(255,189,115,.18);
  background: linear-gradient(90deg,rgba(255,189,115,.07),transparent 65%),var(--panel);
  padding: 10px 24px;
}
.debate-board header,.debate-metrics,.debate-issues { display: flex; align-items: center; }
.debate-board header { justify-content: space-between; gap: 12px; }
.debate-board-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; }
.debate-board header span,.debate-board header strong { display: block; }
.debate-board header span { color: var(--amber); font-size: 8px; font-weight: 900; letter-spacing: .14em; }
.debate-board header strong { max-width: 720px; overflow: hidden; margin-top: 3px; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.debate-board header em { border: 1px solid rgba(255,189,115,.24); border-radius: 999px; padding: 5px 8px; color: var(--amber); font-size: 9px; font-style: normal; }
.debate-board .debate-board-actions button { min-height: 26px; border: 1px solid rgba(255,189,115,.24); border-radius: 999px; background: transparent; padding: 4px 8px; color: var(--muted); font-size: 9px; }
.debate-board .debate-board-actions button:hover { border-color: rgba(255,189,115,.5); color: var(--amber); }
.debate-metrics { flex-wrap: wrap; gap: 12px; color: var(--muted2); font-size: 9px; }
.debate-metrics strong { margin-left: 4px; color: var(--text); }
.debate-issues { min-width: 0; gap: 6px; overflow-x: auto; scrollbar-width: thin; }
.debate-issues small { flex: 0 0 auto; color: var(--muted2); font-size: 9px; }
.debate-issue { flex: 0 0 auto; max-width: 290px; overflow: hidden; border: 1px solid rgba(255,189,115,.2); border-radius: 7px; background: rgba(255,189,115,.05); padding: 5px 8px; color: var(--amber); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.debate-issue.resolved { border-color: rgba(117,230,195,.2); background: rgba(117,230,195,.05); color: var(--mint); }

.message.meeting > div { border-left: 3px solid rgba(117,230,195,.45); }
.message.debate > div { border-left: 3px solid rgba(255,189,115,.5); }
.message.chair > div { border-color: rgba(173,156,255,.28); background: rgba(173,156,255,.055); }
.message header > div:first-child { display: flex; min-width: 0; align-items: center; gap: 7px; }
.message-purpose,.message-badge { border: 1px solid var(--line); border-radius: 999px; padding: 3px 6px; color: var(--muted); font-size: 9px; font-weight: 500; }
.message-badge { color: var(--amber); }
.message header small { flex: 0 0 auto; }

.harness-explainer { margin: -4px 0 0; color: var(--muted2); font-size: 10px; line-height: 1.6; }
.harness-agent-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.harness-member { display: grid; gap: 11px; border-left: 3px solid rgba(117,230,195,.4)!important; }
.harness-member.claude { border-left-color: rgba(173,156,255,.55)!important; }
.harness-member.antigravity { border-left-color: rgba(255,189,115,.55)!important; }
.harness-member.disabled { opacity: .52; }
.harness-member > header { min-width: 0; display: grid; grid-template: "mark name enabled" auto ". chair remove" auto / 38px minmax(0,1fr) auto; align-items: center; gap: 8px 9px; }
.harness-member .provider-mark { grid-area: mark; display: grid; width: 38px; height: 38px; place-items: center; border-radius: 10px; background: rgba(117,230,195,.1); color: var(--mint); font-size: 10px; font-weight: 900; }
.harness-member.claude .provider-mark { background: rgba(173,156,255,.1); color: var(--violet); }
.harness-member.antigravity .provider-mark { background: rgba(255,189,115,.1); color: var(--amber); }
.harness-name { grid-area: name; min-width: 0; }
.harness-name span { color: var(--muted2); font-size: 9px; }
.harness-name input { width: 100%; margin-top: 4px; }
.harness-check { display: flex!important; grid-template-columns: none!important; align-items: center; gap: 5px!important; white-space: nowrap; }
.harness-check input { width: auto; padding: 0; }
.harness-enabled { grid-area: enabled; justify-self: end; }
.harness-chair { grid-area: chair; justify-self: start; }
.harness-remove { grid-area: remove; justify-self: end; border: 0!important; background: transparent!important; padding: 4px!important; color: var(--red)!important; }
.harness-member-fields { min-width: 0; max-width: 100%; display: grid; grid-template-columns: minmax(0,1.8fr) repeat(3,minmax(0,1fr)) minmax(58px,.7fr); gap: 8px; }
.harness-member-fields label { min-width: 0; }
.harness-member-fields select,.harness-member-fields input { width: 100%; min-width: 0; max-width: 100%; }
.harness-strengths { margin: 0; color: var(--muted2); font-size: 9px; }
.harness-add { display: grid; grid-template-columns:minmax(180px,1fr) minmax(220px,1fr) auto; align-items: end; gap: 10px; border: 1px dashed var(--line2); border-radius: 11px; padding: 12px; }
.harness-add strong,.harness-add small { display: block; }
.harness-add small { margin-top: 4px; color: var(--muted2); font-size: 9px; }

@media (max-width: 1200px) {
  .harness-agent-grid { grid-template-columns: 1fr; }
  .harness-member-fields { grid-template-columns: minmax(0,1.8fr) repeat(3,minmax(0,1fr)) minmax(58px,.7fr); }
}
@media (max-width: 760px) {
  .chat-panel { grid-template-rows: auto minmax(0,1fr); }
  .debate-board { padding-inline: 12px; }
  .debate-metrics { gap: 7px; }
  .harness-member-fields,.harness-add { grid-template-columns: 1fr; }
}

/* Bright office theme: calm contrast, obvious actions and readable work surfaces. */
body {
  background: #edf1f7;
}

button,
input,
select,
textarea {
  outline: none;
}

button {
  transition: border-color .16s ease, background-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}

button:not(:disabled):hover {
  transform: translateY(-1px);
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  border-color: rgba(8,127,103,.55)!important;
  box-shadow: 0 0 0 3px rgba(8,127,103,.13)!important;
}

.auth-screen {
  background:
    radial-gradient(circle at 18% 8%,rgba(65,126,218,.12),transparent 32%),
    radial-gradient(circle at 82% 92%,rgba(8,127,103,.11),transparent 34%),
    #f5f7fb;
}

.auth-card {
  border-color: rgba(45,61,82,.12);
  background: rgba(255,255,255,.94);
  box-shadow: 0 28px 80px rgba(34,50,72,.14);
}

.auth-card input {
  border-color: var(--line2);
  background: #f8fafc;
}

.auth-actions button:not(.primary) {
  border-color: var(--line2);
  background: #fff;
  color: var(--muted);
}

.triad-mark {
  border-color: rgba(8,127,103,.18);
  background: linear-gradient(145deg,#fff,#e9f4f1);
  box-shadow: 0 6px 18px rgba(8,127,103,.1);
}

.titlebar {
  border-color: var(--line);
  background: rgba(255,255,255,.96);
  box-shadow: 0 3px 14px rgba(31,45,64,.06);
  backdrop-filter: blur(16px);
}

.titlebar-product span {
  border-color: rgba(8,127,103,.2);
  background: #ecf8f4;
  color: var(--mint);
}

.titlebar-command {
  border-color: var(--line);
  background: #f4f7fa;
}

.message-search-results {
  border-color: var(--line);
  background: #fff;
  box-shadow: 0 18px 48px rgba(31,45,64,.16);
}

.message-search-results button:hover {
  background: #edf8f5;
}

.sidebar {
  border-color: var(--line);
  background: #f8fafc;
}

.side-item:hover,
.side-item.active {
  border-color: rgba(8,127,103,.16);
  background: #e6f4f0;
  color: var(--mint);
}

.oauth-lock {
  border-color: rgba(8,127,103,.14);
  background: #edf8f5;
}

.workspace-shell {
  background: #edf1f7;
}

.project-rail,
.agent-drawer {
  border-color: var(--line);
  background: #f8fafc;
}

.project-item:hover {
  border-color: var(--line);
  background: #f0f4f8;
}

.project-item.active {
  border-color: rgba(8,127,103,.2);
  background: #e8f5f1;
  box-shadow: inset 3px 0 #087f67;
}

.project-icon,
#user-avatar {
  background: #eeeafd;
  color: var(--violet);
}

.project-rail > footer button:hover {
  background: #edf1f6;
}

.conversation {
  background:
    radial-gradient(circle at 50% -18%,rgba(64,119,210,.08),transparent 34%),
    #f5f7fb;
}

.conversation-header {
  border-bottom: 1px solid rgba(28,39,55,.04);
}

.write-mode,
.status-chip,
.view-tabs {
  border-color: var(--line);
  background: #fff;
  box-shadow: 0 5px 16px rgba(31,45,64,.05);
}

.write-mode > i {
  background: #d8dee8;
}

.write-mode > i::after {
  background: #fff;
  box-shadow: 0 1px 4px rgba(31,45,64,.22);
}

.write-mode input:checked + i {
  background: rgba(8,127,103,.28);
}

.write-mode input:checked + i::after {
  background: #087f67;
}

.view-tabs {
  width: fit-content;
  max-width: calc(100% - 56px);
  overflow-x: auto;
  scrollbar-width: none;
}

.view-tabs::-webkit-scrollbar {
  display: none;
}

.view-tabs button {
  flex: 0 0 auto;
}

.view-tabs button:hover {
  background: #f2f5f8;
  color: var(--text);
}

.view-tabs button.active {
  background: #e5f3ef;
  color: #076c58;
}

.chat-scroll {
  background: linear-gradient(180deg,rgba(255,255,255,.48),rgba(245,247,251,.9));
  scrollbar-color: rgba(82,96,119,.42) transparent;
}

.chat-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.chat-scroll::-webkit-scrollbar-thumb {
  border-color: #f5f7fb;
  background: rgba(82,96,119,.42);
}

.chat-empty {
  color: var(--muted);
}

.starter-actions button {
  border-color: var(--line);
  background: #fff;
  color: var(--muted);
  box-shadow: 0 6px 18px rgba(31,45,64,.06);
}

.starter-actions button:first-child {
  border-color: #087f67;
  background: #087f67;
  color: #fff;
}

.message {
  margin-right: clamp(0px,6vw,72px);
}

.message.user {
  margin-right: 0;
  margin-left: clamp(0px,8vw,96px);
}

.message > div {
  border-color: rgba(35,49,68,.11);
  background: #fff;
  box-shadow: 0 7px 22px rgba(32,47,70,.06);
}

.message.user > div {
  border-color: rgba(49,107,214,.16);
  background: #edf4ff;
}

.message.meeting > div {
  border-left-color: #15967b;
}

.message.debate > div {
  border-left-color: #d0832f;
  background: #fffdf9;
}

.message.chair > div {
  border-color: rgba(103,84,198,.22);
  background: #f6f3ff;
}

.message p {
  color: #293548;
}

.message-avatar {
  border-color: rgba(8,127,103,.14);
  background: #e8f5f1;
}

.message.claude .message-avatar {
  border-color: rgba(103,84,198,.14);
  background: #f0edff;
}

.message.antigravity .message-avatar {
  border-color: rgba(168,93,11,.14);
  background: #fff4e7;
}

.message.user .message-avatar {
  border-color: rgba(49,107,214,.14);
  background: #e9f1ff;
  color: var(--blue);
}

.message-purpose,
.message-badge {
  border-color: rgba(35,49,68,.11);
  background: #f4f6f9;
}

.message-badge {
  background: #fff4e7;
}

.live-run {
  border-color: rgba(8,127,103,.2);
  background: rgba(255,255,255,.96);
  box-shadow: 0 14px 40px rgba(31,45,64,.15);
}

.chat-bottom {
  border-color: rgba(8,127,103,.26);
  background: #fff;
  box-shadow: 0 10px 28px rgba(31,45,64,.16);
}

.debate-board {
  border-color: rgba(168,93,11,.16);
  background: linear-gradient(90deg,#fff7eb,#fff 72%);
  box-shadow: 0 5px 18px rgba(77,52,20,.05);
}

.debate-issue {
  border-color: rgba(168,93,11,.18);
  background: #fff7eb;
}

.debate-issue.resolved {
  border-color: rgba(8,127,103,.18);
  background: #edf8f5;
}

.composer {
  border-color: var(--line);
  background: rgba(255,255,255,.98);
  box-shadow: 0 -8px 24px rgba(31,45,64,.055);
}

.mention-row button {
  border-color: var(--line);
  background: #f5f7fa;
  color: var(--muted);
}

.mention-row button:first-child {
  border-color: rgba(8,127,103,.22);
  background: #eaf7f3;
  color: var(--mint);
}

.mention-row .debate {
  border-color: rgba(168,93,11,.2);
  background: #fff5e9;
  color: var(--amber);
}

.composer textarea {
  border-color: rgba(35,49,68,.16);
  background: #f8fafc;
  color: var(--text);
}

.composer-row button {
  border-color: #087f67;
  background: #087f67;
  color: #fff;
  font-weight: 700;
}

.agent-policy,
.agent-card,
.activity-item,
.workflow-run,
.git-overview article,
.git-changes,
.git-diff,
.harness-section,
.admin-create {
  border-color: var(--line);
  background: #fff;
  box-shadow: 0 5px 18px rgba(31,45,64,.045);
}

.agent-card.running,
.agent-card.queued {
  border-color: rgba(8,127,103,.24);
  background: #f3fbf8;
}

.agent-heading > span,
.workflow-run-icon,
.output-shortcuts button > span,
.git-change > span {
  background: #e8f5f1;
}

.agent-model,
.admin-panel input,
.admin-panel select,
.admin-panel button,
.registrations-panel button,
.git-panel input,
.git-panel button,
.upload-artifact {
  border-color: var(--line2);
  background: #f7f9fc;
  color: var(--text);
}

.workflows-panel,
.activity-panel,
.git-panel,
.harness-panel,
.admin-panel,
.registrations-panel {
  background: #f5f7fb;
}

.workflow-card {
  border-color: var(--line);
  background: linear-gradient(145deg,#fff,#f3faf8);
  box-shadow: 0 8px 24px rgba(31,45,64,.055);
}

.workflow-card:hover,
.output-shortcuts button:hover {
  border-color: rgba(8,127,103,.25);
  box-shadow: 0 12px 30px rgba(31,45,64,.09);
}

.workflow-run-progress {
  background: #e2e7ee;
}

.output-shortcuts button {
  border-color: rgba(8,127,103,.14);
  background: #f0faf7;
}

.harness-panel select,
.harness-panel input,
.harness-panel textarea {
  border-color: var(--line2);
  background: #fff;
  color: var(--text);
}

.harness-agent-grid article {
  border-color: var(--line);
  background: #fff;
  box-shadow: 0 5px 16px rgba(31,45,64,.045);
}

.activity-item pre,
#git-diff-content {
  background: #182131;
  color: #e7edf7;
}

/* Shared document notice used inside the click-to-open preview dialog. */
.output-document-notice{display:grid;place-items:center;min-height:230px;text-align:center}.output-document-notice strong{display:grid;width:82px;height:82px;place-items:center;border-radius:18px;background:#e5efff;color:#1d4ed8;font-size:18px}.output-document-notice p{max-width:470px;color:var(--muted);line-height:1.6}

/* Guided project setup turns user choices into the saved project contract. */
.project-wizard{width:min(900px,calc(100vw - 32px));max-height:calc(100vh - 32px);margin:auto;border:0;border-radius:22px;background:#fff;color:var(--text);box-shadow:0 28px 90px rgba(15,23,42,.25);padding:0}.project-wizard::backdrop{background:rgba(15,23,42,.48);backdrop-filter:blur(5px)}.project-wizard form{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;max-height:calc(100vh - 32px)}
.project-wizard form>header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:22px 24px 16px}.project-wizard form>header span{color:#2563eb;font-size:.72rem;font-weight:900;letter-spacing:.14em}.project-wizard form>header h2{margin:3px 0 4px;font-size:1.35rem}.project-wizard form>header p{margin:0;color:var(--muted)}.project-wizard form>header button{width:34px;height:34px;border:0;border-radius:10px;background:#f1f5f9;font-size:20px}
.wizard-progress{position:relative;display:flex;justify-content:flex-end;overflow:hidden;background:#e8eef7;padding:9px 24px}.wizard-progress i{position:absolute;inset:0 auto 0 0;width:20%;background:linear-gradient(90deg,#60a5fa,#34d399);transition:width .2s ease}.wizard-progress span{position:relative;color:#0f172a;font-size:10px;font-weight:800}
.wizard-step{overflow:auto;padding:22px 24px}.wizard-step>h3{margin:0 0 13px;font-size:1.08rem}.wizard-step>p{margin:-7px 0 14px;color:var(--muted)}.wizard-title{display:grid;gap:7px;margin-bottom:18px;color:#334155;font-weight:800}.wizard-title input,.wizard-title textarea{border:1px solid #cbd5e1;border-radius:11px;background:#fff;padding:11px;color:var(--text);font:inherit;resize:vertical}
.wizard-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.wizard-options.compact{margin-top:12px}.wizard-options>label{position:relative;cursor:pointer}.wizard-options input{position:absolute;opacity:0;pointer-events:none}.wizard-options label>span{display:grid;gap:4px;height:100%;border:1px solid #dbe4f0;border-radius:13px;background:#f8fafc;padding:14px;transition:.15s ease}.wizard-options label>span b{font-size:12px}.wizard-options label>span small{color:var(--muted);line-height:1.4}.wizard-options input:checked+span{border-color:#3b82f6;background:#eff6ff;box-shadow:0 0 0 2px rgba(59,130,246,.12)}.wizard-options input:focus-visible+span{outline:3px solid rgba(37,99,235,.22)}
.wizard-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.wizard-summary article{display:grid;gap:5px;border:1px solid #dbe4f0;border-radius:12px;background:#f8fafc;padding:14px}.wizard-summary small{color:var(--muted)}.wizard-policy{margin:16px 0 0;border-radius:11px;background:#ecfdf5;padding:13px;color:#166534;line-height:1.55}.project-wizard form>footer{display:flex;gap:8px;border-top:1px solid #e2e8f0;padding:14px 24px}.project-wizard form>footer span{flex:1}.project-wizard form>footer button{border:1px solid #dbe4f0;border-radius:9px;background:#f8fafc;padding:9px 14px}.project-wizard form>footer button.primary{border-color:#2563eb;background:#2563eb;color:#fff}

@media(max-width:760px){.wizard-options{grid-template-columns:1fr 1fr}.wizard-summary{grid-template-columns:1fr}}

.harness-hero {
  border-color: rgba(8,127,103,.16);
  background: linear-gradient(135deg,#eaf8f4,#f2efff);
}

.harness-add {
  border-color: rgba(8,127,103,.24);
  background: #f8fcfb;
}

.harness-heading strong {
  border-color: rgba(8,127,103,.18);
  background: #eaf7f3;
}

.toggle-control {
  background: #f8fafc;
}

.mini-toggle i {
  background: #d8dee8;
}

.mini-toggle i::after {
  background: #fff;
  box-shadow: 0 1px 4px rgba(31,45,64,.2);
}

.mini-toggle input:checked + i {
  background: rgba(8,127,103,.24);
}

.mini-toggle input:checked + i::after {
  background: #087f67;
}

.admin-table-wrap {
  border-color: var(--line);
  background: #fff;
  box-shadow: var(--shadow);
}

.admin-table th {
  background: #f2f5f9;
}

#toast {
  border-color: rgba(35,49,68,.14);
  background: #fff;
  color: var(--text);
  box-shadow: 0 12px 36px rgba(31,45,64,.18);
}

@media (max-width: 760px) {
  .view-tabs { max-width: calc(100% - 28px); }
  .message,.message.user { margin-inline: 0; }
  .conversation-header { background: rgba(255,255,255,.72); }
}

/* Attachments belong to the message being composed, not to the output browser. */
.composer {
  position: relative;
  transition: background .16s ease, box-shadow .16s ease;
}

.composer.dragging {
  background: #eaf8f4;
  box-shadow: inset 0 0 0 2px #087f67;
}

.composer.dragging::before {
  content: "이 채팅에 파일 첨부";
  position: absolute;
  inset: 8px;
  z-index: 3;
  display: grid;
  place-items: center;
  border: 2px dashed #087f67;
  border-radius: 12px;
  background: rgba(234,248,244,.96);
  color: #075f4f;
  font-size: 13px;
  font-weight: 800;
  pointer-events: none;
}

.composer-row {
  grid-template-columns: 44px minmax(0,1fr) auto;
  align-items: end;
}

.composer-row .chat-attach-button {
  width: 44px;
  height: 44px;
  align-self: stretch;
  border: 1px solid var(--line2);
  border-radius: 11px;
  background: #f3f7fb;
  color: #146b5b;
  font-size: 24px;
  font-weight: 400;
}

.composer-row .chat-attach-button:hover,
.composer-row .chat-attach-button:focus-visible {
  outline: none;
  border-color: rgba(8,127,103,.42);
  background: #eaf8f4;
}

.chat-attachments {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  margin: 0 0 8px;
  padding: 2px 1px;
}

.chat-attachment-chip {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 210px;
  max-width: 330px;
  border: 1px solid #cfe1dd;
  border-radius: 10px;
  background: #f5fbf9;
  padding: 7px 8px;
}

.chat-attachment-chip > span:first-child,
.message-attachment-link > span:first-child {
  display: grid;
  min-width: 34px;
  height: 30px;
  place-items: center;
  border-radius: 7px;
  background: #e1f3ed;
  color: #087f67;
  font-size: 8px;
  font-weight: 800;
}

.chat-attachment-thumbnail {
  width: 42px;
  height: 42px;
  border: 1px solid #cfe1dd;
  border-radius: 8px;
  background: #fff;
  object-fit: cover;
}

.chat-attachment-chip > span:nth-child(2),
.message-attachment-link > span:nth-child(2) { display: grid; min-width: 0; gap: 2px; }
.chat-attachment-chip strong,
.message-attachment strong { overflow: hidden; color: var(--text); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.chat-attachment-chip small,
.message-attachment small { color: var(--muted); font-size: 8px; }
.chat-attachment-chip button { width: 28px; height: 28px; border: 0; border-radius: 7px; background: transparent; color: #8f3a47; font-size: 17px; }
.chat-attachment-chip button:hover { background: #fdeef0; }

.chat-attachment-status {
  display: block;
  margin: 6px 0 0 52px;
  color: var(--muted);
  font-size: 9px;
}

.message-attachments { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.message-attachment { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; min-width: 210px; max-width: 350px; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: inherit; }
.message-attachment-image { width: min(420px,100%); max-width: 100%; overflow: hidden; }
.message-attachment-preview { grid-column: 1 / -1; display: block; width: 100%; max-height: 420px; overflow: hidden; border: 0; border-bottom: 1px solid var(--line); background:#eef2f7; padding:0; cursor:zoom-in; }
.message-attachment-preview img { display:block; width:100%; max-height:420px; margin:0; object-fit:contain; }
.message-attachment:hover { border-color: rgba(8,127,103,.34); background: #f4faf8; }
.message-attachment-link { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 8px; min-width: 0; padding: 7px 9px; color: inherit; text-decoration: none; }
.message-attachment-remove { width: 30px; height: 30px; margin-right: 5px; border: 0; border-radius: 7px; background: transparent; color: #8f3a47; font-size: 17px; }
.message-attachment-remove:hover { background: #fdeef0; }

@media (max-width: 760px) {
  .composer-row { grid-template-columns: 40px minmax(0,1fr); }
  .composer-row .chat-attach-button { width: 40px; }
  .composer-row #chat-send { grid-column: 1 / -1; width: 100%; min-height: 40px; }
  .chat-attachment-status { margin-left: 0; }
}

/* Files stay directory-first. Preview and authoring surfaces open only on demand. */
.files-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  margin: 0 22px 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(31, 45, 64, .07);
}

.files-panel > .file-toolbar {
  position: static;
  z-index: auto;
  display: flex;
  min-width: 0;
  min-height: 52px;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  flex-wrap: nowrap;
  border-bottom: 1px solid #e3e9f1;
  background: #fbfcfe;
  padding: 9px 12px;
}

.files-panel > .file-toolbar code {
  flex: 1 0 140px;
  min-width: 0;
  overflow: hidden;
  color: #176b5c;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.files-panel > .file-toolbar button,
.files-panel > .file-toolbar .upload-artifact {
  flex: 0 0 auto;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d7e0eb;
  border-radius: 9px;
  background: #fff;
  padding: 7px 11px;
  color: #344156;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

.files-panel > .file-toolbar button:disabled {
  cursor: not-allowed;
  opacity: .4;
}

.internal-directory {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  background: #fff;
  padding: 18px;
}

.internal-directory > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid #e8edf4;
  padding: 1px 2px 16px;
}

.internal-directory > header span {
  color: #087f67;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
}

.internal-directory > header h2 {
  margin: 4px 0 4px;
  font-size: 18px;
}

.internal-directory > header p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.internal-directory > header strong {
  flex: 0 0 auto;
  border: 1px solid #dce5ef;
  border-radius: 999px;
  background: #f6f8fb;
  padding: 7px 10px;
  color: #5b687b;
  font-size: 10px;
}

.directory-list {
  display: grid;
  align-content: start;
  gap: 4px;
  padding: 10px 0 0;
}

.file-entry-row {
  min-width: 0;
  display: grid;
  grid-template-columns: 28px minmax(0,1fr);
  align-items: center;
  gap: 2px;
}

.file-entry-select {
  min-height: 42px;
  display: grid;
  place-items: center;
  border-radius: 8px;
}

.file-entry-select:hover {
  background: #f2f8f6;
}

.file-entry-select input {
  width: 16px;
  height: 16px;
  accent-color: #087f67;
}

.directory-list .file-entry {
  width: 100%;
  min-width: 0;
  min-height: 54px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 11px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  padding: 7px 10px;
  color: #263246;
  text-align: left;
}

.directory-list .file-entry:hover,
.directory-list .file-entry:focus-visible {
  outline: none;
  border-color: #d6e4e0;
  background: #f2f8f6;
}

.directory-list .file-entry.selected {
  border-color: #bcded5;
  background: #eaf6f2;
  color: #075f50;
}

.file-entry-icon {
  display: grid;
  width: 38px;
  height: 34px;
  place-items: center;
  border-radius: 8px;
  background: #eef2f7;
  color: #536174;
  font-size: 9px;
  font-weight: 900;
}

.file-entry.directory .file-entry-icon {
  background: #e6f5f0;
  color: #087f67;
}

.file-entry-copy {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.file-entry-copy strong,
.file-entry-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.file-entry-copy strong { font-size: 12px; }
.file-entry-copy small { color: #7a8799; font-size: 10px; font-weight: 500; }
.file-entry-arrow { color: #9aa6b6; font-size: 22px; line-height: 1; }

.file-preview-dialog,
.document-studio-dialog {
  width: min(980px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100vh - 32px);
  margin: auto;
  overflow: hidden;
  border: 0;
  border-radius: 18px;
  background: #fff;
  color: var(--text);
  padding: 0;
  box-shadow: 0 28px 90px rgba(15, 23, 42, .26);
}

.file-preview-dialog::backdrop,
.document-studio-dialog::backdrop {
  background: rgba(15, 23, 42, .48);
  backdrop-filter: blur(4px);
}

.file-preview-dialog > form {
  max-height: calc(100vh - 32px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.file-preview-dialog > form > header,
.document-studio > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid #e5eaf1;
  margin: 0;
  padding: 18px 20px 15px;
}

.file-preview-dialog > form > header span,
.document-studio > header span {
  color: #087f67;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
}

.file-preview-dialog > form > header h2,
.document-studio > header h2 {
  margin: 4px 0;
  font-size: 18px;
}

.file-preview-dialog > form > header p,
.document-studio > header p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.dialog-close {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 9px;
  background: #f0f3f7;
  color: #536174;
  font-size: 21px;
  line-height: 1;
}

.file-preview-body {
  min-width: 0;
  min-height: 320px;
  overflow: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  background: #f6f8fb;
  padding: 16px 20px;
}

.file-preview-body .output-preview {
  min-height: 280px;
  overflow: auto;
  border: 1px solid #dde4ed;
  border-radius: 12px;
  background: #fff;
  padding: 18px;
}

.file-preview-body .output-preview > img {
  display: block;
  max-width: 100%;
  max-height: 65vh;
  margin: auto;
  object-fit: contain;
}

.file-preview-body .output-preview > iframe {
  width: 100%;
  height: min(65vh, 720px);
  border: 0;
}

.file-preview-body .output-preview > pre {
  margin: 0;
  color: #263246;
  font: 12px/1.65 ui-monospace, SFMono-Regular, Menlo, monospace;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.file-preview-body > textarea {
  min-height: 260px;
  resize: vertical;
  border: 1px solid #cfd9e5;
  border-radius: 12px;
  background: #fff;
  padding: 14px;
  color: #263246;
  font: 12px/1.65 ui-monospace, SFMono-Regular, Menlo, monospace;
}

.file-preview-dialog > form > footer,
.document-studio > footer {
  display: flex;
  align-items: center;
  gap: 8px;
  border-top: 1px solid #e5eaf1;
  background: #fff;
  padding: 12px 20px;
}

.file-preview-dialog > form > footer span { flex: 1; }
.file-preview-dialog > form > footer a { color: #087f67; font-size: 11px; font-weight: 800; text-decoration: none; }
.file-preview-dialog > form > footer button,
.document-studio > footer button {
  min-height: 34px;
  border: 1px solid #d7e0eb;
  border-radius: 9px;
  background: #f8fafc;
  padding: 7px 11px;
  font-size: 11px;
  font-weight: 700;
}
.file-preview-dialog > form > footer .danger { color: #b4233a; }
.file-preview-dialog > form > footer button:disabled { cursor: not-allowed; opacity: .42; }

.document-studio-dialog > form {
  max-height: calc(100vh - 32px);
  overflow: auto;
}

.document-studio-dialog .document-studio {
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  padding: 0;
}

.document-studio-dialog .document-studio-grid {
  grid-template-columns: minmax(0, 1fr) minmax(300px, .85fr);
  gap: 12px;
  padding: 18px 20px;
}

.document-studio-dialog .document-studio-grid select {
  width: 100%;
  min-height: 40px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  padding: 8px 11px;
  color: #172554;
}

.document-studio-dialog .document-studio-grid > label:nth-child(2) {
  grid-column: 1;
}

.document-studio-dialog .document-body-label { grid-column: 1; }
.document-studio-dialog .document-studio-grid > article { grid-column: 2; grid-row: 1 / 4; }
.document-studio > footer { justify-content: flex-end; }

.message-attachment-link {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.message-attachment-link:focus-visible {
  outline: 2px solid rgba(8, 127, 103, .35);
  outline-offset: -2px;
  border-radius: 8px;
}

@media (max-width: 760px) {
  .files-panel { margin-inline: 10px; }
  .internal-directory { padding: 12px; }
  .internal-directory > header { display: grid; gap: 10px; }
  .internal-directory > header strong { justify-self: start; }
  .file-preview-dialog,
  .document-studio-dialog { width: calc(100vw - 16px); max-height: calc(100vh - 16px); }
  .file-preview-dialog > form { max-height: calc(100vh - 16px); }
  .file-preview-dialog > form > footer { flex-wrap: wrap; }
  .file-preview-dialog > form > footer span { display: none; }
  .document-studio-dialog .document-studio-grid { grid-template-columns: 1fr; }
  .document-studio-dialog .document-studio-grid > article { grid-column: 1; grid-row: auto; min-height: 220px; }
}