.agent-thread { display: flex; flex-direction: column; min-height: 0; flex: 1; position: relative; font: 14px/1.6 system-ui, sans-serif; color: var(--ink, #314034); } .agent-thread-status { padding: 7px 24px; color: #65728a; font-size: 12px; border-bottom: 1px solid #edf0f5; } .agent-thread-history { overflow: auto; flex: 1; min-height: 100px; padding: 20px max(24px, calc((100% - 820px) / 2)); } .agent-request { margin: 0 0 30px; min-width: 0; } .agent-request-source { font-size: 11px; color: #748098; margin: 0 0 10px; } .agent-message { white-space: pre-wrap; overflow-wrap: anywhere; margin: 10px 0; } .agent-message-user { background: #edf1fa; border-radius: 9px; padding: 12px 16px; } .agent-message-assistant { padding: 6px 2px; } .agent-request-card { padding: 8px 2px; color: #65728a; font-size: 12px; } .agent-request-card > div:first-child { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; } .agent-request-card button { font-size: 12px; } .agent-request-card p { margin: 5px 0; } .agent-request-failed, .agent-request-uncertain { border-left: 3px solid #c77528; padding-left: 12px; } .agent-thread pre { max-height: 320px; overflow: auto; font: 12px/1.6 ui-monospace, monospace; padding: 12px; background: #f4f6fa; border-radius: 5px; white-space: pre-wrap; overflow-wrap: anywhere; } .agent-activity-card, .agent-commentary { border: 1px solid #e0e5ee; border-radius: 7px; padding: 8px 12px; margin: 10px 0; font-size: 12px; overflow-wrap: anywhere; } .agent-thread summary { cursor: pointer; } .agent-widget { margin: 14px 0; padding: 14px; border: 1px solid #dae0e8; border-radius: 8px; min-width: 0; overflow: auto; } .agent-question { background: #fff8e9; padding: 16px; border: 1px solid #e8d5a6; border-radius: 8px; margin: 16px 0; } .agent-question fieldset { display: flex; flex-direction: column; gap: 10px; border: 0; padding: 0; } .agent-question legend { font-weight: 600; margin-bottom: 10px; } .agent-question input { margin: 0 7px; } .agent-result { font-size: 14px; color: #253044; padding: 10px 0; } .agent-result dl { display: grid; grid-template-columns: minmax(70px, 120px) minmax(0, 1fr); gap: 8px 16px; margin: 0 0 12px; } .agent-result dt { color: #65728a; } .agent-result dd { margin: 0; overflow-wrap: anywhere; } .agent-status-card { border-left: 3px solid #7894cc; background: #f2f5fb; padding: 12px; margin: 12px 0; } .agent-thread-composer { padding: 12px 24px 18px; border-top: 1px solid #dae0e8; background: #fff; } .agent-compose-label { display: block; font-size: 12px; color: #65728a; } .agent-compose-label textarea { width: 100%; box-sizing: border-box; display: block; font: 14px/1.5 system-ui, sans-serif; padding: 10px; margin-top: 4px; border: 1px solid #cbd3df; border-radius: 7px; min-height: 78px; max-height: 240px; } .agent-compose-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 10px; } .agent-compose-actions > span { margin-left: auto; color: #748098; font-size: 11px; } .agent-compose-actions details { font-size: 12px; position: relative; } .agent-compose-actions details label { display: flex; gap: 8px; margin: 7px 0; } .agent-jump { position: absolute; bottom: 180px; align-self: center; box-shadow: 0 2px 10px #23304722; } .agent-empty { padding: 40px 0; color: #65728a; text-align: center; } .agent-empty h2 { font-weight: 500; } @media (max-width: 700px) { .agent-shell { height: 100dvh; } .agent-shell-header { padding: 9px 12px; gap: 12px; } .agent-account > span { display: none; } .agent-shell-body { flex-direction: column; } .agent-sidebar { width: auto; max-height: 150px; padding: 10px 12px; border-right: 0; border-bottom: 1px solid #dae0e8; flex-direction: row; flex-wrap: wrap; gap: 8px; } .agent-sidebar > label { flex: 1; min-width: 100px; } .agent-sidebar nav { flex-direction: row; width: 100%; flex: 1 0 100%; } .agent-sidebar nav a { min-width: 140px; padding: 6px 10px; } .agent-directory { width: 100%; } .agent-thread-header { padding: 10px 12px; } .agent-thread-header h1 { font-size: 16px; } .agent-thread-header button { font-size: 12px; } .agent-thread-status { padding: 5px 12px; } .agent-thread-history { padding: 12px; } .agent-thread-composer { padding: 10px 12px; } .agent-compose-actions { gap: 8px; } .agent-compose-actions > span { display: none; } .agent-settings-page { padding: 16px; } .agent-settings-columns { grid-template-columns: 1fr; } } .agent-model-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; } .agent-model-controls label { display: flex; align-items: center; gap: 6px; font-size: 12px; } .agent-model-controls small { flex-basis: 100%; color: #73806f; } .agent-routing-change { border-left: 2px solid #9cae8c; padding: 6px 12px; font-size: 12px; color: #65745d; } .agent-thread .agent-result :is(ol, dl) { margin: 4px 0; } .agent-result dd { min-width: 0; overflow-wrap: anywhere; }