.ops-panel { color: var(--text, #edf0f8); min-width: 0; }
.ops-panel h3, .ops-panel h4, .ops-panel p { margin: 0; }
.ops-toolbar, .ops-box > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ops-toolbar h3 { font-size: 20px; }
.ops-toolbar p, .ops-help, #ops-status, #ops-copy-status { color: #bac5d8; font-size: 13px; line-height: 1.65; }
#ops-status, #ops-copy-status { padding: 10px 0; overflow-wrap: anywhere; }
#ops-storage-usage { padding: 8px 0 0; overflow-wrap: anywhere; }
.ops-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.ops-metrics > div { display: flex; flex-direction: column; gap: 5px; border: 1px solid #3b3f4d; background: #23252d; border-radius: 10px; padding: 12px; min-width: 0; }
.ops-metrics small { color: #bac5d8; font-size: 12px; }
.ops-metrics strong { font-size: 21px; overflow-wrap: anywhere; }
.ops-shortcuts, .ops-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.ops-shortcuts { margin-bottom: 14px; }
.ops-panel button, .ops-panel input, .ops-panel select, .ops-panel textarea { font: inherit; }
.ops-panel button { min-height: 42px; white-space: normal; line-height: 1.3; }
.ops-panel button:disabled { opacity: .55; cursor: not-allowed; }
.ops-panel button:focus-visible, .ops-panel summary:focus-visible, .ops-panel input:focus-visible, .ops-panel textarea:focus-visible, .ops-panel select:focus-visible { outline: 2px solid #83d8ff; outline-offset: 3px; }
.ops-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ops-box { padding: 14px; border: 1px solid #3b3f4d; border-radius: 12px; margin: 12px 0; min-width: 0; background: #1c1e24; }
.ops-box h4 { font-size: 16px; }
.ops-box > header { flex-wrap: wrap; margin-bottom: 9px; }
.ops-box > header span { color: #bfcbdc; font-size: 12px; }
.ops-panel summary { cursor: pointer; line-height: 1.6; min-height: 40px; padding: 6px 0; overflow-wrap: anywhere; }
.ops-panel label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: #d1dbea; min-width: 0; margin-top: 9px; }
.ops-panel input:not([type=checkbox]), .ops-panel select, .ops-panel textarea { width: 100%; max-width: 100%; box-sizing: border-box; min-height: 42px; border: 1px solid #415167; color: #edf0f8; background: #14151a; border-radius: 7px; padding: 9px; font-size: 14px; }
.ops-panel textarea { resize: vertical; line-height: 1.6; }
.ops-panel .ops-selection { flex-direction: row; align-items: center; gap: 7px; min-height: 42px; margin: 0; }
.ops-selection input { width: 18px; height: 18px; flex: 0 0 18px; }
.ops-search { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; margin: 9px 0; }
.ops-search label { flex: 1 1 140px; margin: 0; }
.ops-case { padding: 9px 11px; margin-top: 10px; border: 1px solid #3f4251; border-radius: 8px; background: #24262e; min-width: 0; }
.ops-message, .ops-case blockquote { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; line-height: 1.7; }
.ops-case blockquote { padding: 10px; margin: 8px 0; border-left: 3px solid #8295b3; color: #d5dfed; background: #1a1b21; }
.ops-case .ops-help { margin-top: 8px; }
.ops-report { padding: 10px 0; border-bottom: 1px solid #434756; }
.ops-list > p { font-size: 13px; color: #bac5d8; padding: 15px 0; }
.ops-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; }
.ops-wide { grid-column: 1 / -1; }
#ops-selected-count { font-size: 12px; color: #b9e3ff; margin-left: 6px; }
#ops-preview-label[hidden] { display: none !important; }
#ops-export-preview { font-size: 12px; }
.ops-user { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; border-top: 1px solid #3b3f4d; padding: 10px 0; }
.ops-user small { flex: 1 1 170px; color: #bac5d8; }
#ops-room-summary p { padding: 5px 0; font-size: 13px; overflow-wrap: anywhere; }
.ops-attachments { margin: 12px 0; padding: 8px 10px; border: 1px solid #41516b; border-radius: 9px; background: #1a1b21; min-width: 0; }
.ops-attachments > summary { font-size: 13px; font-weight: 700; color: #dbe4ff; }
.ops-attachment-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.ops-attachment { margin: 0; min-width: 0; padding: 9px; border: 1px solid #3b3f4d; border-radius: 8px; }
.ops-attachment.is-expanded { grid-column: 1 / -1; }
.ops-attachment figcaption { overflow-wrap: anywhere; font-size: 12px; font-weight: 700; }
.ops-attachment > button { width: 100%; margin-top: 8px; }
.ops-attachment .ops-help { font-size: 11px; }
.ops-attachment .ops-image-preview { display: block; width: 100%; min-height: 0; padding: 0; margin: 0 0 8px; overflow: hidden; border: 1px solid #415167; border-radius: 6px; background: #0e0f12; }
.ops-image-preview img { display: block; width: 100%; max-height: 180px; object-fit: contain; }
.ops-image-preview.is-expanded img { max-height: min(70vh, 700px); }
.ops-attachments [hidden] { display: none !important; }
#ops-export-attachments { min-width: 0; }
@media(max-width: 1050px) { .ops-columns { grid-template-columns: 1fr; gap: 0; } }
@media(max-width: 540px) {
  .ops-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ops-metrics strong { font-size: 18px; }
  .ops-toolbar { align-items: flex-start; flex-direction: column; }
  .ops-box { padding: 10px; }
  .ops-fields { grid-template-columns: 1fr; }
  .ops-wide { grid-column: auto; }
  .ops-search button { flex: 1 0 100%; }
  .ops-panel button { min-height: 44px; }
  .ops-attachment-grid { grid-template-columns: 1fr; }
  .ops-attachments { padding: 8px; }
}
