.rich-response { display: grid; gap: 8px; }
.rich-response > p, .rich-response .response-section > p { margin: 0; line-height: 1.48; white-space: pre-wrap; }
.metric-strip { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 2px; }
.metric-strip span { padding: 5px 8px; border: 1px solid rgba(242,13,39,.56); background: rgba(242,13,39,.11); color: #fff; font: 800 10px/1 monospace; letter-spacing: .03em; box-shadow: -1px 1px #1375d5; }
.response-section { display: grid; gap: 5px; padding: 9px 10px; border: 1px solid rgba(255,255,255,.10); border-left: 3px solid #f20d27; background: linear-gradient(100deg, rgba(255,255,255,.065), rgba(242,13,39,.09), rgba(20,90,170,.045)); box-shadow: inset 0 1px rgba(255,255,255,.08); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); clip-path: polygon(0 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%); }
.response-section h3 { margin: 0; color: #ff5368; font: 900 10px/1.25 monospace; letter-spacing: .09em; text-transform: uppercase; }
.response-list { display: grid; gap: 5px; margin: 0; padding-left: 20px; }
.response-list li { padding-left: 2px; line-height: 1.42; }
.response-list li::marker { color: #f20d27; font-weight: 900; }
.rich-response strong { color: #fff; }
.rich-response code { padding: 2px 5px; border: 1px solid rgba(20,117,213,.45); background: #090c13; color: #71b8ff; font-family: monospace; }
.rich-response a { color: #65b2ff; text-decoration-color: #f20d27; text-underline-offset: 3px; overflow-wrap: anywhere; }
.rich-response blockquote { margin: 0; padding: 10px 12px; border: 1px solid rgba(20,117,213,.42); background: rgba(20,80,150,.09); color: #dbeaff; font-style: italic; }
.response-table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid rgba(242,13,39,.3); }
.response-table-wrap table { width: 100%; border-collapse: collapse; font-size: 11px; }
.response-table-wrap th { color: #ff6072; font: 800 9px/1.2 monospace; letter-spacing: .05em; text-transform: uppercase; background: rgba(242,13,39,.12); }
.response-table-wrap th, .response-table-wrap td { padding: 7px; border-bottom: 1px solid rgba(255,255,255,.08); text-align: left; vertical-align: top; }

.chatgpt-response { display: block; }
.response-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 9px; }
.response-avatar { width: 24px; height: 24px; display: grid; place-items: center; flex: 0 0 24px; border: 1px solid rgba(255,255,255,.23); border-radius: 4px; color: #fff; background: radial-gradient(circle at 35% 30%,#ff784f,#8f0018 48%,#09080b 72%); box-shadow: -2px 0 #1575f4,2px 0 #e40025; font: italic 950 11px/1 monospace; }
.response-author { color: #fff; font: 850 10px/1 monospace; letter-spacing: .09em; text-transform: uppercase; }
.response-body { min-width: 0; }
.response-actions { display: flex; align-items: center; gap: 3px; min-height: 26px; margin: 8px -4px -4px; opacity: 0; transform: translateY(-3px); transition: opacity .2s ease,transform .2s ease; }
.response-actions.is-visible { opacity: 1; transform: none; }
.response-action { min-height: 26px; display: inline-flex; align-items: center; gap: 5px; border: 0; border-radius: 6px; padding: 4px 7px; color: #928d94; background: transparent; cursor: pointer; font: 700 9px/1 monospace; }
.response-action:hover,.response-action:focus-visible { color: #fff; background: rgba(255,255,255,.075); outline: 0; }
.response-action.is-confirmed { color: #55d99d; }
.response-action-icon { font-size: 13px; }
.response-copy-fallback { position: fixed; left: -9999px; width: 1px; height: 1px; }
.response-stream { min-height: 1.5em; margin: 0; white-space: pre-wrap; }
.response-stream::after { content: ""; display: inline-block; width: 7px; height: 1em; margin-left: 3px; vertical-align: -.12em; background: #f20d27; box-shadow: -2px 0 #1575f4; animation: response-cursor .68s steps(2,end) infinite; }
.is-generating .response-body { display: flex; align-items: center; gap: 9px; color: #aaa3a9; }
.thinking-label { font-size: 11px; }
.thinking-dots { display: inline-flex; gap: 3px; }
.thinking-dots i { width: 4px; height: 4px; border-radius: 50%; background: #ff563d; animation: thinking-dot .9s ease-in-out infinite; }
.thinking-dots i:nth-child(2) { animation-delay: .15s; }
.thinking-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes response-cursor { 50% { opacity: 0; } }
@keyframes thinking-dot { 50% { transform: translateY(-4px); background: #55aaff; } }

@media (max-width: 460px) {
  .response-action-label { display: none; }
  .response-action { padding-inline: 8px; }
}