/* A focused support workspace, with the same layout in both themes. */
.sidebar nav { margin-top: 32px; }
.nav-more { margin-top: 22px; color: var(--muted); }
.nav-more > summary { padding: 12px 10px; font-size: 13px; cursor: pointer; }
.operator { margin-top: auto; }
.topbar { min-height: 66px; }
.theme-toggle { white-space: nowrap; font-size: 12px; padding: 8px 12px; }
.connection { font-size: 11px; }
.page-heading { margin-bottom: 22px; }
.page-heading h1 { font-size: 28px; letter-spacing: -.5px; }
.page-heading p { font-size: 13px; line-height: 1.6; }
.queue-summary { display: flex; flex-wrap: wrap; gap: 28px; margin: 0 0 22px; color: var(--muted); font-size: 13px; }
.queue-summary b { font-size: 19px; color: var(--text); margin-right: 5px; }
.queue-summary .summary-critical b { color: var(--red); }
.filter-tab { font-size: 13px; }
.toolbar .search, .toolbar select { font-size: 12px; padding: 10px 12px; }
.inbox-content { grid-template-columns: minmax(270px,.82fr) minmax(390px,1.4fr); }
.ticket-row { padding: 18px; }
.row-title { font-size: 13px; margin-top: 7px; -webkit-line-clamp: 2; line-height: 1.55; }
.row-category { font-size: 11px; color: var(--muted); }
.row-bottom { margin-top: 12px; font-size: 11px; }
.list-meta { font-size: 10px; }
.detail { padding: 25px; }
.detail-title { font-size: 20px; font-weight: 650; }
.detail-sub { font-size: 12px; margin-bottom: 22px; }
.detail-heading .btn { margin-left: auto; }
.section-caption { font-size: 12px; font-weight: 600; letter-spacing: 0; color: var(--muted); text-transform: none; }
.detail-section { margin-top: 22px; }
.message-block { padding: 15px; border-radius: 9px; background: var(--panel2); }
.message-block + .message-block { margin-top: 9px; }
.message-text { font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
.messages-section .message-text { max-height: 260px; overflow-y: auto; }
.reply-section textarea { min-height: 145px; line-height: 1.65; font-size: 14px; }
.reply-section .hint { margin: 8px 0 14px; }
.action-row { gap: 8px; }
.btn { font-size: 12px; }
.hint { font-size: 12px; line-height: 1.6; color: var(--muted); }
.case-more, .library-more, .extra-fields { border-top: 1px solid var(--line); padding: 16px 0 0; margin-top: 24px; }
.case-more > summary, .library-more > summary, .extra-fields > summary { color: var(--muted); font-size: 13px; cursor: pointer; }
#case-more-content { padding-top: 20px; }
.case-more .confidence { font-size: 12px; }
.library-more { margin: 0 0 18px; border: 0; }
.library-more .stats-grid { margin-top: 18px; }
.game-tabs { gap: 7px; }
.game-tabs .btn { font-size: 12px; }
.rule-card { padding: 20px; }
.rule-card h3 { font-size: 16px; }
.rule-card p { font-size: 13px; line-height: 1.75; }
.age-note { margin: -10px 0 16px; }
.photo-picker { border: 1px dashed var(--line); border-radius: 10px; padding: 17px; margin-top: 18px; }
.photo-picker.dragging { border-color: var(--accent); background: var(--panel2); }
.photo-picker > .hint { margin-top: 9px; }
.photo-picker label.btn { position: relative; display: inline-flex; width: auto; cursor: pointer; margin: 0; }
.file-input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; padding: 0; border: 0; }
.photo-picker label:focus-within { outline: 2px solid var(--accent); outline-offset: 3px; }
.upload-previews, .evidence-gallery { display: grid; grid-template-columns: repeat(auto-fill,minmax(100px,1fr)); gap: 10px; }
.upload-previews:not(:empty) { margin-top: 14px; }
.upload-preview { position: relative; min-width: 0; }
.upload-preview img, .evidence-thumb img { width: 100%; height: 110px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); background: var(--panel2); }
.upload-preview > span, .evidence-thumb > span { display: block; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 4px; color: var(--muted); }
.upload-preview .icon-btn { position: absolute; top: 4px; right: 4px; width: 27px; height: 27px; background: #fff; color: #202b37; border: 1px solid #ccd2da; border-radius: 50%; }
.evidence-thumb { padding: 0; border: 0; background: none; min-width: 0; text-align: left; }
.evidence-thumb:hover img { border-color: var(--accent); }
.evidence-section .hint { margin-top: 8px; }
#photo-viewer { width: min(1000px,94vw); max-height: 93vh; padding: 20px; }
#photo-title { font-size: 16px; overflow-wrap: anywhere; }
#full-photo { display: block; max-width: 100%; max-height: 70vh; object-fit: contain; margin: 14px auto; }
#photos-dialog { width: min(580px,94vw); }
dialog { color: var(--text); }
dialog form label { font-size: 13px; }
.extra-fields { padding: 12px 0; }
footer { padding-top: 20px; color: var(--muted); font-size: 11px; }

:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f5f7fa; --panel: #ffffff; --panel2: #f1f4f8;
  --line: #dce3eb; --muted: #586779; --text: #182737;
  --accent: #397923; --red: #b72d38; --amber: #926015; --blue: #285b9d;
}
[data-theme="light"] .sidebar, [data-theme="light"] .topbar { background: #fff; }
[data-theme="light"] .sidebar .brand > div { color: var(--text); }
[data-theme="light"] .brand-mark { background: #84cc16; color: #172b10; }
[data-theme="light"] input, [data-theme="light"] textarea, [data-theme="light"] select { background: #fff; color: var(--text); border-color: #cbd5e1; }
[data-theme="light"] input::placeholder, [data-theme="light"] textarea::placeholder { color: #748294; }
[data-theme="light"] .nav-item, [data-theme="light"] .btn, [data-theme="light"] .icon-btn { color: var(--text); }
[data-theme="light"] .nav-item:hover, [data-theme="light"] .btn:hover { background: #f0f3f7; border-color: #bdc9d7; }
[data-theme="light"] .nav-item.active { background: #edf5e7; color: #30691e; }
[data-theme="light"] .nav-item b { background: #e3eadc; color: #315f24; }
[data-theme="light"] .avatar { background: #e6edf6; color: #385271; }
[data-theme="light"] .btn { background: #fff; border-color: #cbd5e1; }
[data-theme="light"] .btn.primary { background: #397923; border-color: #397923; color: #fff; }
[data-theme="light"] .btn.primary:hover { background: #2c621b; }
[data-theme="light"] .btn.ghost { background: transparent; }
[data-theme="light"] .ticket-row { border-color: var(--line); color: var(--text); }
[data-theme="light"] .ticket-row:hover { background: #f4f7fa; }
[data-theme="light"] .ticket-row.selected { background: #edf5e7; }
[data-theme="light"] .row-title, [data-theme="light"] .message-text, [data-theme="light"] .event p, [data-theme="light"] .rule-card p, [data-theme="light"] .citation p, [data-theme="light"] .metrics-table td, [data-theme="light"] .step p { color: var(--text); }
[data-theme="light"] .row-bottom, [data-theme="light"] .detail-id, [data-theme="light"] .list-meta, [data-theme="light"] .section-caption, [data-theme="light"] .draft-note, [data-theme="light"] .crumb, [data-theme="light"] .crumb span, [data-theme="light"] .event time, [data-theme="light"] .details-list, [data-theme="light"] .metric-explainer, [data-theme="light"] .stat small, [data-theme="light"] .stat-top, [data-theme="light"] .page-heading p, [data-theme="light"] .language-picker, [data-theme="light"] .ai-facts { color: var(--muted); }
[data-theme="light"] .badge { color: #536276; background: #f1f4f8; border-color: #d2dbe6; }
[data-theme="light"] .badge.p0 { color: #9c2631; background: #feecef; border-color: #efc4cc; }
[data-theme="light"] .badge.p1 { color: #85530b; background: #fff4da; border-color: #ebd8a8; }
[data-theme="light"] .badge.p2 { color: #285698; background: #eaf2ff; border-color: #c9dbf6; }
[data-theme="light"] .badge.p3, [data-theme="light"] .badge.language { color: #536276; background: #f1f4f8; }
[data-theme="light"] .badge.success { background: #e9f5e5; color: #326d25; border-color: #c9dfbf; }
[data-theme="light"] .badge.waiting, [data-theme="light"] .badge.human { background: #fff5e3; color: #805521; border-color: #e6d6b8; }
[data-theme="light"] .message-block, [data-theme="light"] .citation { background: #f7f9fc; border-color: var(--line); }
[data-theme="light"] .citation summary { color: #355779; }
[data-theme="light"] .ai-card { background: #f1f7ed; border-color: #d6e4cf; }
[data-theme="light"] .ai-summary, [data-theme="light"] .confidence { color: #375a2a; }
[data-theme="light"] .alert { background: #fff6e6; color: #755025; border-color: #e6d3b2; }
[data-theme="light"] .alert.info { background: #edf4ff; color: #315783; border-color: #ceddf2; }
[data-theme="light"] .alert.error { background: #fff0f1; color: #9b3440; border-color: #edc9ce; }
[data-theme="light"] .language-notice { background: #f3effb; color: #645083; }
[data-theme="light"] dialog, [data-theme="light"] .archive-dialog { background: #fff; color: var(--text); border-color: var(--line); box-shadow: 0 20px 80px #17273733; }
[data-theme="light"] dialog::backdrop { background: #1b293c66; }
[data-theme="light"] #toast { background: #edf6e8; color: #345c25; border-color: #c2d8b6; }
[data-theme="light"] #toast.error { background: #fff0f1; color: #9b3440; border-color: #edc9ce; }
[data-theme="light"] .empty, [data-theme="light"] .empty h3, [data-theme="light"] .empty p, [data-theme="light"] .hint { color: var(--muted); }
[data-theme="light"] .connection.live { color: #397923; }
[data-theme="light"] .age-bump { color: #5a702c !important; }

@media (max-width: 980px) {
  .nav-more > summary { font-size: 10px; padding: 14px 0; }
  .inbox-content { grid-template-columns: minmax(240px,.8fr) minmax(340px,1.2fr); }
  .detail { padding: 18px; }
}
@media (max-width: 720px) {
  .inbox-content { display: block; }
  .queue-summary { gap: 16px; font-size: 12px; }
  .page-heading h1 { font-size: 25px; }
  .theme-toggle { font-size: 11px; padding: 7px; }
  .connection { display: none; }
  .detail-heading { flex-wrap: wrap; }
  .filters { gap: 17px; }
  .evidence-gallery { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .sidebar .nav-more summary { font-size: 9px; }
  .game-tabs .btn { font-size: 11px; }
}

.casework-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:18px}.casework-form{display:grid;gap:10px;margin:14px 0}.casework-form label,.casework label{display:grid;gap:5px}.casework-form textarea{min-height:90px}.casework-form+.casework-form{border-top:1px solid var(--line);padding-top:16px}.casework .citation form{display:grid;gap:8px;padding:8px 0}.case-links{display:flex;gap:5px;flex-wrap:wrap}.casework .flow-incident{padding:12px 0;border-top:1px solid var(--line)}

.trust-section form{display:grid;gap:9px;margin:12px 0}.trust-section label{display:grid;gap:5px}.trust-section input,.trust-section textarea,.trust-section select{width:100%;min-width:0}.trust-section textarea{min-height:65px}.trust-section .case-more{margin:12px 0}.trust-section{overflow-wrap:anywhere}
