:root{font-family:system-ui,sans-serif;color:#dde5f1;background:#111827;color-scheme:dark}body{margin:0}main{max-width:960px;margin:32px auto;padding:0 20px}h1{font-size:28px}small{font-size:16px;color:#a8bbd3}h2{font-size:18px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}label{display:block;font-size:14px}input,select,textarea{box-sizing:border-box;width:100%;padding:10px;margin:5px 0;background:#192436;border:1px solid #637086;border-radius:5px;color:#fff}.check{align-self:center}.check input{width:auto}button{background:#235cc3;color:#fff;border:0;border-radius:5px;padding:11px 16px;margin:10px 8px 0 0;cursor:pointer}button:disabled{opacity:.5;cursor:wait}section,form#connection{padding:20px;margin:20px 0;background:#182235;border-radius:8px}pre,#messages p{white-space:pre-wrap;overflow-wrap:anywhere}#messages{max-height:420px;overflow:auto}#approval{padding:15px;border:1px solid #e5af50;border-radius:6px}#error,.notice{color:#ffd088}p{line-height:1.5}textarea{resize:vertical}

.clipboard-copy{position:fixed;left:-10000px;top:0}

.action-card,.execution-result{padding:15px;margin:12px 0;border:1px solid #e5af50;border-radius:6px}.execution-result{border-color:#637086}#messages pre{white-space:pre-wrap;overflow-wrap:anywhere}#messages summary{cursor:pointer}

.message{padding:12px 14px;margin:12px 0;border-left:3px solid #637086;border-radius:6px;background:#141e2e}
.message-user{color:#22c55e;border-left-color:#22c55e}
.message-assistant{color:#fff;border-left-color:#fff}
.message-role{font-size:13px;display:block;margin-bottom:6px}
.message-body p{margin:6px 0}
.code-block{margin:12px 0;background:#292929;color:#f3f4f6;border:1px solid #484848;border-radius:8px;overflow:hidden}
.code-language{padding:7px 12px;background:#333;color:#cbd5e1;font:12px system-ui,sans-serif;border-bottom:1px solid #484848}
#messages .code-block pre{margin:0;padding:14px;white-space:pre;overflow-x:auto;overflow-wrap:normal;tab-size:4}
.code-block code{font:13px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}
.execution-result>pre{padding:12px;background:#292929;color:#f3f4f6;border-radius:6px}
.activity{display:flex;align-items:center;gap:10px;padding:12px 0;color:#86efac;font-size:14px}
.activity[hidden]{display:none}
.activity-dots{display:inline-flex;gap:4px}
.activity-dots span{width:6px;height:6px;border-radius:50%;background:currentColor;animation:activity-pulse 1.2s infinite ease-in-out}
.activity-dots span:nth-child(2){animation-delay:.15s}.activity-dots span:nth-child(3){animation-delay:.3s}
@keyframes activity-pulse{0%,80%,100%{opacity:.35;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.activity-dots span{animation:none}}

.conversation-header{display:flex;align-items:center;justify-content:space-between;gap:10px 20px;flex-wrap:wrap;margin-bottom:12px}
.conversation-header h2{margin:0}
.mode-control{position:relative;margin-left:auto}
.mode-switch{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px;color:#a8bbd3;min-height:32px}
.mode-switch input:checked+span{color:#22c55e;font-weight:700}
.mode-switch input{appearance:none;width:42px;height:24px;padding:0;margin:0;flex-shrink:0;background:#475569;border:1px solid #94a3b8;border-radius:20px;cursor:pointer;position:relative}
.mode-switch input:before{content:"";position:absolute;width:16px;height:16px;top:3px;left:3px;border-radius:50%;background:white;transition:transform .15s}
.mode-switch input:checked{background:#15803d;border-color:#22c55e}
.mode-switch input:checked:before{transform:translateX(18px)}
.mode-switch input:focus-visible{outline:2px solid #93c5fd;outline-offset:4px}
.mode-switch input:disabled{opacity:.5;cursor:wait}
.mode-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.mode-hint{position:absolute;z-index:5;right:0;top:100%;width:260px;max-width:calc(100vw - 100px);padding:10px 12px;border:1px solid #637086;border-radius:6px;background:#111827;color:#dde5f1;box-shadow:0 4px 16px #0006;font-size:13px;line-height:1.5;visibility:hidden}
.mode-control:hover .mode-hint,.mode-control:focus-within .mode-hint{visibility:visible}
#mode-error{font-size:13px;color:#ffd088;margin:4px 0}
#mode-error:empty{display:none}
@media(prefers-reduced-motion:reduce){.mode-switch input:before{transition:none}}

#connection [hidden]{display:none}
.connection-hint{font-size:13px;color:#a8bbd3;margin:6px 0}
#ssh-host-settings{margin-top:12px;font-size:14px}
#ssh-host-settings summary{cursor:pointer}
.host-key-challenge{margin-top:12px;padding:12px;border:1px solid #e5af50;border-radius:6px;font-size:14px}
.host-key-challenge p{margin:6px 0}
.host-key-challenge code{display:block;overflow-wrap:anywhere;color:#fbbf24}
#ssh-private-key{font-family:ui-monospace,Consolas,monospace}

.conversation-tools{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-left:auto}
.conversation-tools .mode-control{margin-left:0}
.context-control{display:flex;align-items:center;gap:6px;font-size:13px;color:#a8bbd3;white-space:nowrap}
.context-control input{width:62px;padding:4px 5px;margin:0;font-size:14px}
#context-error{font-size:13px;color:#ffd088;margin:4px 0}
#context-error:empty{display:none}
@media(max-width:480px){.conversation-tools{gap:10px}.context-control{font-size:12px}}