/* Falls support tickets. Radii come from the documented scale in tokens.css:
   controls and chips use --radius-sm, surfaces and tables --radius-md, status
   pills --radius-pill. One accent, no decorative colour. */
#tickets-root { min-width: 0; }
.tk-view-tabs, .ts-toolbar, .ts-actions, .ts-save, .ts-preview-buttons { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-3); margin-block-end:var(--space-5); }
.tk-navigation { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:var(--space-3); margin-block-end:var(--space-6); }
.tk-view-tabs { margin:0; gap:var(--space-1); padding:var(--space-1); background:var(--bg-input); border:1px solid var(--border-subtle); border-radius:var(--radius-md); }
.tk-view-tabs .btn { border-color:transparent; background:transparent; }
.tk-view-tabs [aria-pressed="true"] { color:var(--accent-text); background:var(--accent-soft); border-color:var(--accent-indicator); }
#tickets-root :is(button, summary, a, input, select, textarea):focus-visible { outline:2px solid var(--accent-indicator); outline-offset:3px; }
#tickets-root a { text-underline-offset:3px; }
#tickets-root :is(input, textarea) { caret-color:var(--accent-text); }
.ts-intro { margin-block-end:var(--space-5); }
.ts-intro h3 { margin:0 0 var(--space-2); font-family:var(--font-display); font-size:var(--text-xl); }
.ts-intro p { margin:0; color:var(--text-secondary); font-size:var(--text-base); line-height:1.8; }
.ts-layout { display:grid; grid-template-columns:minmax(0, 1fr) minmax(260px, 340px); gap:var(--space-6); align-items:start; }
.ts-layout > *, .ts-grid > * { min-width:0; }
.ts-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-4); }
#ts-fields { border:0; padding:0; margin:0; min-width:0; }
.ts-section { border-block-start:1px solid var(--border-subtle); padding-block:var(--space-4); }
.ts-section summary { cursor:pointer; font-weight:600; padding-block:var(--space-3); font-size:var(--text-md); overflow-wrap:anywhere; }
.ts-section[open] > .ts-grid { margin-block:var(--space-4); }
.ts-field, .ts-toolbar label, .ts-preview-area label { display:grid; gap:var(--space-2); font-size:var(--text-sm); }
.ts-field-wide { grid-column:1 / -1; }
.ts-check-field { grid-template-columns:1fr auto; align-items:center; gap:var(--space-3); }
.ts-check-field .ts-field-error:empty { display:none; }
.ts-check-field label { cursor:pointer; line-height:1.7; }
.ts-field input:not([type="checkbox"]), .ts-field select, .ts-field textarea, .ts-toolbar select, .ts-preview-area select, #tk-action-value { width:100%; min-width:0; min-height:var(--control-h-md); border:1px solid var(--border-medium); border-radius:var(--radius-sm); background:var(--bg-input); color:var(--text-primary); padding-block:var(--space-2); padding-inline-start:var(--space-3); padding-inline-end:var(--space-3); font:inherit; }
.ts-field select, .ts-toolbar select, .ts-preview-area select { padding-inline-end:var(--control-caret-reserve); }
.ts-field textarea { resize:vertical; }
.ts-field input[type="checkbox"], .ts-check input { accent-color:var(--accent-primary); inline-size:18px; block-size:18px; }
.ts-check { display:flex; align-items:center; gap:var(--space-2); color:var(--text-secondary); font-size:var(--text-xs); }
.ts-field-error, #ts-status.tk-error { color:var(--danger); }
#ts-status { min-height:24px; overflow-wrap:anywhere; }
.ts-question { min-width:0; margin:var(--space-4) 0; padding:var(--space-4); border:1px solid var(--border-subtle); border-radius:var(--radius-sm); }
.ts-question legend { color:var(--text-secondary); font-size:var(--text-sm); }
.ts-question button { margin-block-start:var(--space-3); }
.ts-save { position:sticky; bottom:0; z-index:2; margin-block:var(--space-5) 0; padding:var(--space-4); border:1px solid var(--border-medium); border-radius:var(--radius-md); background:var(--bg-card); }
#ts-dirty { color:var(--text-secondary); font-size:var(--text-xs); }
.ts-preview-area { border:1px solid var(--border-subtle); border-radius:var(--radius-md); padding:var(--space-5); background:var(--bg-card); position:sticky; top:var(--space-5); }
.ts-preview-label { display:flex; justify-content:space-between; align-items:baseline; gap:var(--space-3); }
#ts-preview-state { color:var(--text-secondary); font-size:var(--text-xs); }
.ts-publish { border-block-start:1px solid var(--border-subtle); margin-block-start:var(--space-6); padding-block-start:var(--space-4); }
.ts-preview-area h3 { font-size:var(--text-base); margin-block:var(--space-3); }
.ts-preview-area :is(h3,h4) { font-family:var(--font-display); }
.ts-preview-area h3:not(:first-child) { margin-block-start:var(--space-7); }
/* Discord embeds have a real 4px accent: this is a faithful message preview. */
.ts-embed { border-inline-start:4px solid var(--accent-indicator); border-radius:var(--radius-sm); padding:var(--space-4); background:var(--bg-card-elevated); overflow-wrap:anywhere; margin-block:var(--space-4); }
.ts-embed h4 { margin-block:0 var(--space-3); }.ts-embed p, .ts-preview-copy, .tk-answers dd { white-space:pre-wrap; overflow-wrap:anywhere; }
.ts-embed img { display:block; max-width:100%; height:auto; margin-block:var(--space-3); }.ts-embed .ts-thumb { max-width:80px; }
.ts-embed small { color:var(--text-secondary); }.ts-preview-buttons button { white-space:normal; }
.ts-preview-area [data-ts-action="publish"] { margin-block-start:var(--space-4); }
.tk-answers { padding:var(--space-4) var(--space-5); }.tk-answers dt { font-weight:600; }.tk-answers dd { margin:var(--space-2) 0 var(--space-4); color:var(--text-secondary); }
@media (max-width:1100px) { .ts-layout { grid-template-columns:minmax(0,1fr); } .ts-preview-area { position:static; } }
@media (max-width:600px) { .ts-grid { grid-template-columns:minmax(0,1fr); }.ts-toolbar { align-items:stretch; }.ts-toolbar label { flex:1 1 100%; }.tk-detail-actions { flex-wrap:wrap; } }
.tk-toolbar, .tk-section-heading, .tk-pagination, .tk-detail-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.tk-toolbar { margin-bottom: var(--space-6); flex-wrap: wrap; }
.tk-toolbar p { margin: 0; color: var(--text-secondary); font-size: var(--text-sm); line-height: 1.8; }
.tk-filters { display: grid; grid-template-columns: minmax(140px, .7fr) minmax(150px, .8fr) minmax(200px, 1.6fr); gap: var(--space-4); }
.tk-filters label { display: grid; gap: var(--space-2); color: var(--text-primary); font-size: var(--text-sm); min-width: 0; font-weight: 550; }
.tk-filters input, .tk-filters select { width: 100%; min-width: 0; min-height: var(--control-h-md); padding-block: var(--space-2); padding-inline-start: var(--space-3); border: 1px solid var(--border-medium); border-radius: var(--radius-sm); background-color: var(--bg-input); color: var(--text-primary); font: inherit; font-size: var(--text-sm); font-weight: 400; }
.tk-filters select { padding-inline-end: var(--control-caret-reserve); }
#tickets-status { min-height: 22px; margin: var(--space-2) 0; color: var(--text-secondary); font-size: var(--text-sm); line-height: 1.8; overflow-wrap: anywhere; }
#tickets-status.tk-error { color: var(--danger); }
.tk-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--space-1); padding-block:var(--space-2); margin-block-end:var(--space-5); border-block:1px solid var(--border-subtle); }
.tk-stat { display:flex; align-items:center; gap:var(--space-3); padding:var(--space-3); border:1px solid transparent; border-radius:var(--radius-sm); background:transparent; color:var(--text-primary); text-align:start; font:inherit; cursor:pointer; }
.tk-stat:hover { background:var(--bg-card-elevated); }
.tk-stat[aria-pressed="true"] { background:var(--accent-soft); border-color:var(--accent-indicator); color:var(--accent-text); }
.tk-stat span { color:var(--text-secondary); font-size:var(--text-sm); line-height:1.6; }
.tk-stat strong { font-family:var(--font-display); font-size:var(--text-2xl); line-height:1.2; font-weight:650; font-variant-numeric:tabular-nums; }
.tk-policy { color:var(--text-secondary); font-size:var(--text-sm); margin-block:var(--space-2) var(--space-6); }
.tk-policy summary { cursor:pointer; padding-block:var(--space-3); }
.tk-panel { border: 1px solid var(--border-subtle); border-radius: var(--radius-md); background: var(--bg-card); margin-bottom: var(--space-6); overflow: hidden; }
.tk-section-heading { padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--border-subtle); }
.tk-section-heading h3 { margin: 0; color: var(--text-primary); font-size: var(--text-base); font-weight: 650; }
.tk-section-heading > span { color: var(--text-muted); font-size: var(--text-xs); }
.tk-table-wrap { width: 100%; overflow-x: auto; }
.tk-table { width:100%; table-layout:fixed; border-collapse:collapse; color:var(--text-secondary); font-size:var(--text-sm); text-align:start; }
.tk-table th:first-child { width:43%; }
.tk-table th:nth-child(2) { width:27%; }
.tk-table td, .tk-table .mod-identity, .tk-table .mod-name { min-width:0; overflow-wrap:anywhere; }
.tk-table .mod-identity { max-width:100%; }
.tk-table .mod-name strong { white-space:normal; }
.tk-table .mod-name small { display:none; }
.tk-table th { padding: var(--space-3) var(--space-4); color: var(--text-muted); font-size: var(--text-2xs); font-weight: 500; text-align: start; white-space: nowrap; }
.tk-table td { padding: var(--space-4); border-top: 1px solid var(--border-subtle); vertical-align: middle; }
.tk-table tbody tr:hover, .tk-table tbody tr:focus-within, .tk-table .tk-selected { background: var(--bg-card-elevated); }
.tk-table .tk-selected { background:var(--accent-soft); }
.tk-table button[data-tk-open] { display:grid; gap:var(--space-1); width:100%; min-height:44px; padding:0; border:0; background:transparent; color:var(--text-primary); font:inherit; font-weight:600; text-align:start; cursor:pointer; }
.tk-subject { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; line-height:1.7; }
.tk-row-member { margin-block-start:var(--space-2); }
.tk-row-member .mod-name strong { color:var(--text-secondary); font-weight:400; }
.tk-row-kind { display:block; color:var(--text-muted); margin-block-start:var(--space-2); line-height:1.7; }
.tk-number { display: block; color: var(--text-primary); font: 600 13px var(--font-mono, monospace); }
.tk-date { display: block; color: var(--text-muted); font-size: var(--text-2xs); line-height: 1.8; }
.tk-muted { color: var(--text-muted); font-size: var(--text-xs); line-height: 1.7; }
.tk-pill { display:inline-flex; align-items:center; padding:var(--space-1) var(--space-2); border:1px solid var(--border-medium); border-radius:var(--radius-pill); color:var(--text-secondary); font-size:var(--text-xs); line-height:1.6; max-width:100%; }
.tk-pill.tk-open { border-color: var(--accent-primary); color: var(--accent-text); }
.tk-pill.tk-waiting { border-color:var(--warning); color:var(--warning); }
.tk-pill.tk-resolved { border-color:var(--success); color:var(--success); }
.tk-pill.tk-closed { color: var(--text-muted); }
.tk-empty { padding: var(--space-9) var(--space-6); text-align: center; color: var(--text-secondary); font-size: var(--text-base); line-height: 1.9; }
.tk-empty strong { display: block; margin-bottom: var(--space-2); color: var(--text-primary); font-size: var(--text-lg); font-weight: 600; }
.tk-empty > svg { display:block; width:40px; height:40px; margin:0 auto var(--space-5); color:var(--accent-text); }
.tk-empty p { margin:0 auto var(--space-4); max-width:38ch; }
.tk-detail-placeholder { min-height:300px; display:grid; align-items:center; }
.tk-skeleton { padding: var(--space-4) var(--space-5); border-top: 1px solid var(--border-subtle); }
.tk-skeleton span { display: block; height: 12px; border-radius: var(--radius-sm); background: linear-gradient(90deg, var(--bg-card-elevated), var(--border-subtle), var(--bg-card-elevated)); background-size: 200% 100%; animation: tk-shimmer 1.4s ease-in-out infinite; }
.tk-skeleton span + span { margin-top: 10px; width: 62%; }
@keyframes tk-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.tk-detail-head { padding:var(--space-5); flex-wrap:wrap; align-items:flex-start; }
.tk-detail-title { min-width:0; width:100%; }
.tk-detail-state { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:var(--space-3); margin-block-end:var(--space-4); }
.tk-detail-title h3 { overflow-wrap:anywhere; line-height:1.5; }
.tk-detail-head h3 { margin: 0 0 var(--space-2); color: var(--text-primary); font-size: var(--text-xl); font-weight: 650; }
.tk-detail-head p { margin: 0; color: var(--text-secondary); font-size: var(--text-sm); line-height: 1.9; }
.tk-detail-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.tk-manage { margin:0 var(--space-5) var(--space-5); border-block:1px solid var(--border-subtle); }
.tk-manage summary { padding-block:var(--space-3); color:var(--text-secondary); font-size:var(--text-sm); cursor:pointer; }
.tk-manage .tk-detail-actions { padding-block-end:var(--space-4); }
.tk-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-4); padding:0 var(--space-5) var(--space-5); }
.tk-fact { display:grid; align-content:start; gap:var(--space-1); font-size:var(--text-sm); line-height:1.7; min-width:0; }
.tk-fact span { color:var(--text-muted); font-size:var(--text-xs); }
.tk-fact b { color: var(--text-primary); font-weight: 550; overflow-wrap: anywhere; }
.tk-feedback > .tk-muted { margin:0 var(--space-5) var(--space-5); }
#ticket-detail h4 { margin:var(--space-4) var(--space-5) 0; font-size:var(--text-base); }
.tk-timeline { list-style:none; margin:0; padding:var(--space-5); display:grid; gap:var(--space-4); }
.tk-timeline li > div { min-width:0; overflow-wrap:anywhere; }
.tk-timeline li { display: grid; grid-template-columns: 12px 1fr; gap: var(--space-3); align-items: start; }
.tk-timeline i { width: 8px; height: 8px; margin-top: 6px; border-radius: var(--radius-pill); background: var(--accent-indicator); }
.tk-timeline p { margin: 0; color: var(--text-secondary); font-size: var(--text-sm); line-height: 1.8; }
.tk-timeline small { display: block; color: var(--text-muted); font-size: var(--text-2xs); }
.tk-transcript { margin: 0 var(--space-5) var(--space-5); padding: 14px var(--space-4); border: 1px solid var(--border-medium); border-radius: var(--radius-sm); font-size: var(--text-sm); line-height: 1.8; }
.tk-transcript a { color: var(--accent-text); }
.tk-pagination { padding: var(--space-4) var(--space-5); border-top: 1px solid var(--border-subtle); }
.tk-pagination > span { color: var(--text-secondary); font-size: var(--text-xs); }
dialog.tk-dialog { width: min(520px, calc(100vw - 32px)); padding: var(--space-6); border: 1px solid var(--border-medium); border-radius: var(--radius-md); background: var(--bg-card); color: var(--text-primary); }
dialog.tk-dialog::backdrop { background: var(--overlay); }
dialog.tk-dialog h3 { margin:0 0 var(--space-2); font-size:var(--text-xl); font-weight:650; }
dialog.tk-dialog p { margin: 0 0 var(--space-4); color: var(--text-secondary); font-size: var(--text-sm); line-height: 1.8; }
dialog.tk-dialog label { display: grid; gap: var(--space-2); color: var(--text-secondary); font-size: var(--text-xs); }
dialog.tk-dialog label { margin-block-start:var(--space-4); }
dialog.tk-dialog :is(select,input) { width:100%; min-height:var(--control-h-md); border:1px solid var(--border-medium); border-radius:var(--radius-sm); background:var(--bg-input); color:var(--text-primary); font:inherit; padding-block:var(--space-2); padding-inline:var(--space-3); }
dialog.tk-dialog select { padding-inline-end:var(--control-caret-reserve); }
dialog.tk-dialog textarea { width: 100%; min-height: 96px; padding: var(--space-3); border: 1px solid var(--border-medium); border-radius: var(--radius-sm); background: var(--bg-input); color: var(--text-primary); font: inherit; font-size: var(--text-sm); font-weight: 400; }
.tk-dialog-actions { display: flex; gap: var(--space-2); justify-content: flex-end; margin-top: 18px; }
@media (max-width: 900px) { .tk-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tk-table td, .tk-table th { padding-inline: var(--space-3); } }
@media (max-width: 600px) {
  .tk-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tk-search { grid-column: 1 / -1; }
  .tk-stat { padding:var(--space-2); }
  .tk-stat strong { font-size: var(--text-2xl); }
  .tk-table button[data-tk-open] { min-height: 44px; }
  .tk-detail-actions { width: 100%; }
  .tk-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .tk-table, .tk-table tbody { display:block; }
  .tk-table tr { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); padding:var(--space-4); gap:var(--space-3); border-block-start:1px solid var(--border-subtle); }
  .tk-table td { display:block; border:0; padding:0; }
  .tk-table td:first-child { grid-column:1 / -1; }
  .tk-table td:last-child { text-align:end; }
  .tk-table td:first-child button { grid-template-columns:auto minmax(0,1fr); gap:var(--space-3); align-items:baseline; }
  .tk-table .tk-row-kind { font-size:var(--text-xs); }
  .tk-navigation { align-items:stretch; }
  .tk-navigation > button { flex:1 1 auto; }
  .tk-view-tabs { flex:1 1 100%; }
  .tk-view-tabs button { flex:1; }
}
@media (prefers-reduced-motion: reduce) { .tk-skeleton span { animation: none; } }