/* U10-B (372): the platform operator's support cases (support-cases.js). Uses the shop design tokens (shop.css) and the
 * usage-costs page frame (platform-costs.css: .pc-back, .pc-tabs). Desktop and phone (375 px): grids stack, tables scroll. */
.sc { max-width: 1080px; margin: 0 auto; padding: 20px 16px 48px; box-sizing: border-box; min-width: 0; }
.sc-head h1 { font: 700 28px/1.2 var(--font-display, inherit); letter-spacing: -0.02em; margin: 0 0 4px; overflow-wrap: anywhere; }
.sc-sub { color: var(--ink-2); margin: 0 0 16px; font-size: 15px; overflow-wrap: anywhere; }
.sc-back2 { margin-left: 14px; }
.sc-card { margin: 0 0 16px; padding: 16px 18px; min-width: 0; }
.sc-card h2 { font-size: 18px; margin: 0 0 8px; }
.sc-h3 { font-size: 15px; margin: 14px 0 6px; }
.sc-fine { font-size: 13px; color: var(--ink-2); line-height: 1.4; }
.sc-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.sc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 14px; }
.sc-grid .au-field:first-child { grid-column: 1 / -1; }
.sc-card select, .sc-card input[type="text"], .sc-card input[type="date"], .sc-card textarea { width: 100%; max-width: 100%; box-sizing: border-box; min-height: 40px; }
#sc-client { max-width: 420px; }
.sc-chip { display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 600; background: var(--fill, #f2f2f4); color: var(--ink); white-space: nowrap; }
.sc-chip.is-open, .sc-chip.is-waiting_on_client { background: var(--amber-soft, #fff4e5); color: var(--amber, #b25000); }
.sc-chip.is-resolved { background: var(--green-soft, #e8f6ec); color: var(--green, #1f7a35); }
.sc-chip.is-closed { color: var(--ink-2); }
.sc-chip.is-p-high, .sc-chip.is-p-urgent, .sc-chip.is-warn { background: var(--red-soft, #fdecea); color: var(--red, #b3261e); }
.sc-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 10px 0 4px; }
.sc-stat { background: var(--surface); border: 1px solid var(--hair); border-radius: var(--r-m, 12px); padding: 10px 12px; min-width: 0; }
.sc-stat strong { display: block; font-size: 22px; font-variant-numeric: tabular-nums; }
.sc-stat span { font-size: 13px; color: var(--ink-2); }
.sc-stat.is-warn { border-color: var(--amber, #b25000); }
.sc-flags, .sc-list, .sc-links, .sc-views, .sc-timeline { list-style: none; margin: 0; padding: 0; }
.sc-flag, .sc-item, .sc-view { padding: 10px 0; border-top: 1px solid var(--hair); overflow-wrap: anywhere; }
.sc-flag:first-child, .sc-item:first-child, .sc-view:first-child { border-top: 0; }
.sc-flag .sc-actions { margin-top: 6px; }
.sc-item-title { font-weight: 600; font-size: 16px; }
.sc-item-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 4px; }
.sc-state { margin: 0 0 12px; }
.sc-resolution { margin: 0 0 12px; }
.sc-links li { padding: 4px 0; overflow-wrap: anywhere; }
.sc-actions-table { width: 100%; font-size: 13px; margin-top: 6px; display: block; overflow-x: auto; }
.sc-actions-table th { white-space: nowrap; }
.sc-route { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; overflow-wrap: anywhere; }
.sc-timeline { counter-reset: none; }
.sc-entry { padding: 8px 0 8px 12px; border-left: 2px solid var(--hair); margin-left: 4px; overflow-wrap: anywhere; }
.sc-entry.is-status, .sc-entry.is-opened { border-left-color: var(--accent, #0a66d8); }
.sc-entry.is-session { border-left-color: var(--amber, #b25000); }
.sc-entry-body { white-space: pre-wrap; margin-top: 2px; }
.sc-update { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sc-update button { margin-top: 6px; margin-bottom: 10px; }
.sc-start { margin-top: 10px; max-width: 520px; }
@media (max-width: 760px) {
  .sc-head h1 { font-size: 22px; }
  .sc-grid, .sc-update { grid-template-columns: 1fr; }
  .sc-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sc-back2 { margin-left: 0; display: block; }
}