/* Amos attention cards use the console's existing light and dark surfaces. */
.ai-attention { min-width: 0; }
.ai-attention-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.ai-attention-toolbar p { flex: 1 1 250px; margin: 0; line-height: 1.6; overflow-wrap: anywhere; }
.ai-attention-toolbar button { min-height: 44px; flex: 0 0 auto; }
.ai-response-page .ai-review-filters button.active { border-color: var(--amos-action-fill, #B94400); background: var(--amos-action-fill, #B94400); color: var(--amos-action-label, #FFFFFF); }
.ai-response-page .ai-review-filters button.active span { color: var(--amos-action-label, #FFFFFF); }
.ai-attention-coverage { padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel-2, var(--card)); color: var(--ink); margin-bottom: 12px; }
.ai-attention-coverage p { margin: 0; font-size: .82rem; line-height: 1.55; overflow-wrap: anywhere; }
.ai-attention-coverage p + p { margin-top: 5px; color: var(--muted); }
.ai-attention-feed-status { margin: 12px 0 18px; color: var(--muted); font-size: .8rem; line-height: 1.5; }
.ai-attention-card { padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: var(--card); margin-bottom: 12px; min-width: 0; }
.ai-attention-card-head, .ai-attention-card-foot { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; }
.ai-attention-card-head > div { min-width: 0; flex: 1 1 140px; }
.ai-attention-card h3 { font-size: 1rem; line-height: 1.4; letter-spacing: -.02em; color: var(--ink); margin: 0 0 4px; overflow-wrap: anywhere; }
.ai-attention-lane, .ai-attention-waiting { color: var(--muted); font-size: .76rem; line-height: 1.5; }
.ai-attention-state { display: inline-flex; align-items: center; max-width: 100%; padding: 5px 9px; border-radius: 999px; border: 1px solid var(--line); background: var(--panel-2, var(--card)); color: var(--ink); font-size: .75rem; line-height: 1.45; overflow-wrap: anywhere; }
.ai-attention-state-ready { border-color: #428557; }
.ai-attention-state-failed, .ai-attention-state-needs_human { border-color: #b5773d; }
.ai-attention-reason { color: var(--ink); font-size: .86rem; line-height: 1.6; margin: 14px 0; overflow-wrap: anywhere; }
.ai-attention-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.ai-attention button { min-height: 44px; border-radius: 11px; font: inherit; font-size: .82rem; line-height: 1.35; padding: 9px 13px; cursor: pointer; }
.ai-attention-open { border: 1px solid var(--line); background: var(--panel-2, var(--card)); color: var(--ink); }
.ai-attention-retry { border: 1px solid var(--amos-action-fill, #B94400); background: var(--amos-action-fill, #B94400); color: var(--amos-action-label, #FFFFFF); }
.ai-attention-retry:hover { background: var(--amos-action-hover, #A63C00); }
.ai-attention button:active { transform: translateY(1px); }
.ai-attention button:focus-visible { outline: 2px solid var(--brand-accent, #FF7A2F); outline-offset: 3px; }
.ai-attention button:disabled { cursor: wait; opacity: .7; }
.ai-attention-action-status { margin: 12px 0 0; color: var(--muted); font-size: .8rem; line-height: 1.5; overflow-wrap: anywhere; }
.ai-attention-empty { text-align: center; padding: 36px 20px; border: 1px solid var(--line); border-radius: 18px; background: var(--card); }
.ai-attention-empty h3 { color: var(--ink); margin: 0 0 8px; font-size: 1.05rem; }
.ai-attention-empty p { color: var(--muted); margin: 0; font-size: .83rem; line-height: 1.6; }
@media (max-width: 700px) {
  .ai-attention-card { padding: 14px; border-radius: 16px; }
  .ai-attention-actions { width: 100%; }
  .ai-attention-actions button { flex: 1 1 110px; }
}
@media (prefers-reduced-motion: reduce) { .ai-attention button:active { transform: none; } }
