/* TrackStation — estilos dos componentes.
   Cores, espaços, raios e sombras vêm dos tokens (var(--…)); a tipografia vem das classes de estilo
   geradas a partir do tokens.json (.body, .label, .caption…), aplicadas na marcação.
   Regras: fio em vez de sombra · azul é foco · número sempre com referência · estado nunca só pela cor. */

:where([class^="ts-"], [class*=" ts-"]),
:where([class^="ts-"], [class*=" ts-"])::before,
:where([class^="ts-"], [class*=" ts-"])::after { box-sizing: border-box; }

body { margin: 0; font-family: var(--font-sans); color: var(--ink); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }

:where(.ts-app, .ts-login, .ts-panel, .ts-table, .ts-cmd, .ts-dialog, .ts-toast, .ts-collab, .ts-insight) :where(p, h1, h2, h3, ul, ol, figure) { margin: 0; padding: 0; }
:where(.ts-app, .ts-login, .ts-panel, .ts-table, .ts-cmd, .ts-dialog) :where(ul, ol) { list-style: none; }
:where([class^="ts-"], [class*=" ts-"]):where(button, a, input, select) { font-family: inherit; }
:where([class^="ts-"], [class*=" ts-"]):where(button) { margin: 0; }

/* utilitários */
.ts-num { font-variant-numeric: tabular-nums; }
.ts-ident { font-feature-settings: "ss02", "tnum"; }
.ts-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.ts-icon { flex: none; display: block; }
.ts-pos { color: var(--success); }
.ts-neg { color: var(--danger); }

/* foco do teclado: 2px da superfície + 2px de accent */
:where([class^="ts-"], [class*=" ts-"]):where(button, a, [tabindex], input, select):focus-visible { outline: 2px solid transparent; outline-offset: 2px; box-shadow: var(--focus-ring); }

@media (prefers-reduced-motion: no-preference) {
  :where(.ts-btn, .ts-iconbtn, .ts-rail__item, .ts-input, .ts-seg__opt, .ts-switch__track, .ts-switch__thumb, .ts-tabs__tab, .ts-team__row, .ts-collab) { transition: background-color .12s ease, border-color .12s ease, color .12s ease, transform .12s ease; }
}

/* ───────────── marca ───────────── */
.ts-logo { display: block; flex: none; }
.ts-logo--color .ts-logo__ring { stroke: var(--ink); }
.ts-logo--color .ts-logo__dash, .ts-logo--color .ts-logo__hands { stroke: var(--brand); }
.ts-logo--color .ts-logo__word { fill: var(--ink); }
.ts-logo--reverse .ts-logo__ring { stroke: var(--on-rail); }
.ts-logo--reverse .ts-logo__dash, .ts-logo--reverse .ts-logo__hands { stroke: var(--brand); }
.ts-logo--reverse .ts-logo__word { fill: var(--on-rail); }
.ts-logo--mono .ts-logo__ring, .ts-logo--mono .ts-logo__dash, .ts-logo--mono .ts-logo__hands { stroke: currentColor; }
.ts-logo--mono .ts-logo__word { fill: currentColor; }

.ts-loader { display: block; flex: none; }
.ts-loader__track { stroke: var(--line-strong); }
.ts-loader__dash { stroke: var(--accent); }
.ts-loader__orbit { transform-box: view-box; transform-origin: 50% 50%; }
.ts-btn--primary .ts-loader__track, .ts-btn--danger .ts-loader__track { stroke: currentColor; opacity: .35; }
.ts-btn--primary .ts-loader__dash, .ts-btn--danger .ts-loader__dash { stroke: currentColor; }
@media (prefers-reduced-motion: no-preference) {
  .ts-loader__orbit { animation: ts-orbit .9s linear infinite; }
}
@keyframes ts-orbit { to { transform: rotate(360deg); } }

/* ───────────── ações ───────────── */
.ts-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); height: var(--control-md); padding: 0 var(--space-4); border: 1px solid transparent; border-radius: var(--radius-md); background: none; color: var(--ink); cursor: pointer; white-space: nowrap; text-decoration: none; user-select: none; flex: none; }
.ts-btn--sm { height: var(--control-sm); padding: 0 var(--space-3); gap: var(--space-1); }
.ts-btn--lg { height: var(--control-lg); padding: 0 var(--space-5); }
.ts-btn--block { display: flex; width: 100%; }
.ts-btn--primary { background: var(--accent); color: var(--on-accent); }
.ts-btn--primary:hover { background: var(--accent-hover); }
.ts-btn--secondary { background: var(--surface-raised); border-color: var(--border); box-shadow: var(--shadow-sm); }
.ts-btn--secondary:hover { background: var(--surface-hover); border-color: var(--ink-soft); }
.ts-btn--ghost { color: var(--accent-ink); }
.ts-btn--ghost:hover { background: var(--accent-soft); }
.ts-btn--danger { background: var(--danger); color: var(--on-danger); }
.ts-btn--danger:hover { filter: brightness(.92); }
.ts-btn:disabled, .ts-btn.is-loading { cursor: default; }
.ts-btn:disabled { opacity: .5; }
.ts-btn:active:not(:disabled) { transform: translateY(1px); }

.ts-iconbtn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: var(--control-md); height: var(--control-md); padding: 0; border: 1px solid transparent; border-radius: var(--radius-md); background: none; color: var(--ink-muted); cursor: pointer; flex: none; }
.ts-iconbtn--sm { width: var(--control-sm); height: var(--control-sm); border-radius: var(--radius-sm); }
.ts-iconbtn:hover { background: var(--surface-hover); color: var(--ink); }
.ts-iconbtn--secondary { background: var(--surface-raised); border-color: var(--border); color: var(--ink); box-shadow: var(--shadow-sm); }
.ts-iconbtn__badge { position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px; padding: 0 var(--space-1); border-radius: var(--radius-full); background: var(--danger); color: var(--on-danger); display: grid; place-items: center; box-shadow: 0 0 0 2px var(--surface-raised); }

.ts-kbd { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 var(--space-1); border: 1px solid var(--line-strong); border-bottom-width: 2px; border-radius: var(--radius-sm); background: var(--surface-raised); color: var(--ink-muted); font-family: var(--font-sans); }
.ts-kbd + .ts-kbd { margin-left: 3px; }

.ts-seg { display: inline-flex; align-items: stretch; gap: 2px; padding: 2px; height: var(--control-md); border-radius: var(--radius-md); background: var(--surface-sunken); flex: none; }
.ts-seg--sm { height: var(--control-sm); border-radius: var(--radius-sm); }
.ts-seg__opt { display: inline-flex; align-items: center; gap: var(--space-2); padding: 0 var(--space-3); border: 0; border-radius: var(--radius-sm); background: none; color: var(--ink-muted); cursor: pointer; white-space: nowrap; }
.ts-seg--sm .ts-seg__opt { padding: 0 var(--space-2); gap: var(--space-1); border-radius: var(--radius-xs); }
.ts-seg__opt:hover { color: var(--ink); }
.ts-seg__opt.is-on { background: var(--surface-raised); color: var(--ink); box-shadow: var(--shadow-sm), 0 0 0 1px var(--line); }
.ts-seg__opt:not(.is-on) .ts-cat__mark { opacity: .5; }

.ts-datestep { display: inline-flex; align-items: stretch; height: var(--control-md); border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface-raised); box-shadow: var(--shadow-sm); flex: none; }
.ts-datestep button { border: 0; background: none; color: var(--ink); cursor: pointer; display: inline-flex; align-items: center; }
.ts-datestep__btn { width: 32px; justify-content: center; color: var(--ink-muted); }
.ts-datestep__btn:first-child { border-radius: var(--radius-md) 0 0 var(--radius-md); }
.ts-datestep__btn:last-child { border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.ts-datestep__btn:hover:not(:disabled), .ts-datestep__date:hover { background: var(--surface-hover); }
.ts-datestep__btn:disabled { color: var(--ink-disabled); cursor: default; }
.ts-datestep__date { gap: var(--space-2); padding: 0 var(--space-3); border-inline: 1px solid var(--line) !important; white-space: nowrap; }
.ts-datestep__date .ts-icon { color: var(--ink-muted); }
.ts-datestep__today { padding: 1px var(--space-2); border-radius: var(--radius-full); background: var(--accent-soft); color: var(--accent-ink); }
.ts-datestep .ts-datestep__jump { padding: 0 var(--space-3); border-left: 1px solid var(--line); border-radius: 0 var(--radius-md) var(--radius-md) 0; color: var(--accent-ink); }
.ts-datestep .ts-datestep__jump:hover { background: var(--surface-hover); }

/* ───────────── entrada ───────────── */
.ts-field { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
.ts-field__label { color: var(--ink); }
.ts-field__hint { margin: 0; color: var(--ink-muted); }
.ts-field__error { margin: 0; display: flex; align-items: center; gap: var(--space-1); color: var(--danger); }
.ts-input { position: relative; display: flex; align-items: center; gap: var(--space-2); height: var(--control-md); padding: 0 var(--space-3); border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface-raised); color: var(--ink); min-width: 0; }
.ts-input--sm { height: var(--control-sm); padding: 0 var(--space-2); border-radius: var(--radius-sm); }
.ts-input--lg { height: var(--control-lg); padding: 0 var(--space-4); }
.ts-input:hover { border-color: var(--ink-soft); }
.ts-input:focus-within { border-color: var(--accent); box-shadow: var(--focus-ring); }
.ts-input.is-invalid { border-color: var(--danger); }
.ts-input__icon { color: var(--ink-muted); }
.ts-input__control { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: inherit; box-shadow: none !important; }
.ts-input__control::placeholder { color: var(--ink-muted); opacity: 1; }
.ts-input__control::-webkit-search-cancel-button { display: none; }
.ts-input__suffix { display: inline-flex; align-items: center; color: var(--ink-muted); flex: none; }
.ts-input--lg .ts-input__suffix { margin-right: calc(var(--space-2) * -1); }
.ts-input--select { padding-right: var(--space-2); }
.ts-input--select select { appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: var(--space-5); }
.ts-input__chevron { position: absolute; right: var(--space-2); color: var(--ink-muted); pointer-events: none; }
.ts-input--search { min-width: 260px; }

.ts-switch { display: flex; align-items: flex-start; gap: var(--space-3); }
.ts-switch__track { position: relative; width: 36px; height: 20px; margin-top: 1px; padding: 0; border: 1px solid var(--border); border-radius: var(--radius-full); background: var(--surface-sunken); cursor: pointer; flex: none; }
.ts-switch__thumb { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: var(--radius-full); background: var(--ink-muted); }
.ts-switch__track.is-on { background: var(--accent); border-color: var(--accent); }
.ts-switch__track.is-on .ts-switch__thumb { transform: translateX(16px); background: var(--on-accent); }
.ts-switch__track:disabled { opacity: .5; cursor: default; }
.ts-switch__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ts-switch__label { color: var(--ink); }
.ts-switch__desc { color: var(--ink-muted); }

.ts-duration__control { display: inline-flex; align-items: stretch; align-self: flex-start; height: var(--control-md); border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface-raised); }
.ts-duration__step { width: 32px; border: 0; background: none; color: var(--ink-muted); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.ts-duration__step:first-child { border-radius: var(--radius-md) 0 0 var(--radius-md); }
.ts-duration__step:last-child { border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.ts-duration__step:hover:not(:disabled) { background: var(--surface-hover); color: var(--ink); }
.ts-duration__step:disabled { color: var(--ink-disabled); cursor: default; }
.ts-duration__value { display: inline-flex; align-items: center; justify-content: center; min-width: 64px; padding: 0 var(--space-2); border-inline: 1px solid var(--line); color: var(--ink); }

.ts-copy__row { display: flex; align-items: center; gap: var(--space-2); }
.ts-copy__value { flex: 1; min-width: 0; height: var(--control-md); display: flex; align-items: center; padding: 0 var(--space-3); border-radius: var(--radius-md); background: var(--surface-sunken); color: var(--ink); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-family: var(--font-sans); }

/* ───────────── estado ───────────── */
.ts-badge { display: inline-flex; align-items: center; gap: var(--space-1); height: 22px; padding: 0 var(--space-2); border-radius: var(--radius-full); white-space: nowrap; flex: none; background: var(--surface-sunken); color: var(--ink-soft); }
.ts-badge--accent { background: var(--accent-soft); color: var(--accent-ink); }
.ts-badge--success { background: var(--success-soft); color: var(--success); }
.ts-badge--warning { background: var(--warning-soft); color: var(--warning); }
.ts-badge--danger { background: var(--danger-soft); color: var(--danger); }
.ts-badge__dot { width: 6px; height: 6px; border-radius: var(--radius-full); background: currentColor; }

.ts-sev { display: inline-flex; flex: none; }
.ts-sev--critico { color: var(--danger); }
.ts-sev--alerta { color: var(--warning); }
.ts-sev--info { color: var(--accent-ink); }

.ts-presence { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--ink-soft); white-space: nowrap; }
.ts-presence__dot, .ts-avatar__presence { width: 8px; height: 8px; border-radius: var(--radius-full); flex: none; }
.ts-presence--online .ts-presence__dot, .ts-avatar__presence.ts-presence--online { background: var(--success); }
.ts-presence--ausente .ts-presence__dot, .ts-avatar__presence.ts-presence--ausente { background: linear-gradient(90deg, var(--warning-mark) 50%, var(--surface-raised) 50%); box-shadow: inset 0 0 0 1.5px var(--warning-mark); }
.ts-presence--offline .ts-presence__dot, .ts-avatar__presence.ts-presence--offline { background: var(--surface-raised); box-shadow: inset 0 0 0 1.5px var(--ink-muted); }
.ts-presence--pendente .ts-presence__dot, .ts-avatar__presence.ts-presence--pendente { background: var(--surface-raised); border: 1.5px dashed var(--ink-muted); }
.ts-presence__since { color: var(--ink-muted); margin-left: calc(var(--space-1) * -1); }

.ts-cat--produtivo { --ts-cat: var(--cat-produtivo); }
.ts-cat--neutro { --ts-cat: var(--cat-neutro); }
.ts-cat--distracao { --ts-cat: var(--cat-distracao); }
.ts-cat--ocioso { --ts-cat: var(--cat-ocioso); }
.ts-cat { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--ink-soft); white-space: nowrap; }
.ts-cat__mark { display: inline-block; width: 10px; height: 10px; border-radius: var(--radius-xs); background: var(--ts-cat); flex: none; }
.ts-cat--ocioso > .ts-cat__mark, .ts-cat__mark.ts-cat--ocioso { height: 0; width: 12px; border-radius: 0; background: none; border-top: 2px dashed var(--cat-ocioso); }

.ts-avatar { position: relative; display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: var(--radius-full); background: var(--accent-soft); color: var(--accent-ink); flex: none; }
.ts-avatar--sm { width: 24px; height: 24px; }
.ts-avatar--lg { width: 56px; height: 56px; }
.ts-avatar__initials { font-weight: 600; letter-spacing: 0; }
.ts-avatar__presence { position: absolute; right: -1px; bottom: -1px; width: 10px; height: 10px; outline: 2px solid var(--ts-ring, var(--surface-raised)); }
.ts-avatar--lg .ts-avatar__presence { width: 14px; height: 14px; right: 1px; bottom: 1px; }
.ts-avatar--sm .ts-avatar__presence { width: 8px; height: 8px; }

.ts-ai { display: inline-flex; align-items: center; gap: var(--space-1); height: 20px; padding: 0 var(--space-2) 0 6px; border-radius: var(--radius-sm); background: var(--accent-soft); color: var(--accent-ink); flex: none; }

.ts-tip { position: relative; display: inline-flex; }
.ts-tip__bubble { position: absolute; left: 50%; bottom: calc(100% + var(--space-2)); transform: translateX(-50%); padding: var(--space-1) var(--space-2); border-radius: var(--radius-sm); background: var(--ink); color: var(--surface-raised); white-space: nowrap; pointer-events: none; opacity: 0; z-index: 40; box-shadow: var(--shadow-md); }
.ts-tip--bottom .ts-tip__bubble { bottom: auto; top: calc(100% + var(--space-2)); }
.ts-tip:hover .ts-tip__bubble, .ts-tip:focus-within .ts-tip__bubble, .ts-tip.is-open .ts-tip__bubble { opacity: 1; }

.ts-skeleton { display: block; border-radius: var(--radius-sm); background: var(--surface-sunken); }
@media (prefers-reduced-motion: no-preference) {
  .ts-skeleton { animation: ts-breathe 1.4s ease-in-out infinite; }
}
@keyframes ts-breathe { 50% { opacity: .55; } }

/* ───────────── dados ───────────── */
.ts-stat { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ts-stat__label { display: flex; align-items: center; gap: var(--space-2); color: var(--ink-muted); }
.ts-stat__value { color: var(--ink); white-space: nowrap; }
.ts-stat--warning .ts-stat__value { color: var(--warning); }
.ts-stat--danger .ts-stat__value { color: var(--danger); }
.ts-stat--success .ts-stat__value { color: var(--success); }
.ts-stat__context { color: var(--ink-muted); }
.ts-stat__extra { margin-top: var(--space-2); }

.ts-statrow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ts-statrow--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ts-statrow--6 { grid-template-columns: 1.35fr repeat(5, minmax(0, 1fr)); }
.ts-statrow > .ts-stat { padding: var(--space-4) var(--space-5); border-left: 1px solid var(--line); }
.ts-statrow--6 > .ts-stat { padding-inline: var(--space-4); }
.ts-statrow--6 > .ts-stat:first-child { padding-left: var(--space-5); }
.ts-statrow > .ts-stat:first-child { border-left: 0; }

.ts-meter { position: relative; display: flex; align-items: center; height: 14px; width: 100%; min-width: 48px; }
.ts-meter--sm { height: 10px; }
.ts-meter__track { display: block; width: 100%; height: 6px; border-radius: var(--radius-full); background: var(--surface-sunken); overflow: hidden; }
.ts-meter--sm .ts-meter__track { height: 4px; }
.ts-meter__fill { display: block; height: 100%; border-radius: var(--radius-full); background: var(--brand); }
.ts-meter--success .ts-meter__fill { background: var(--success); }
.ts-meter--warning .ts-meter__fill { background: var(--warning-mark); }
.ts-meter--danger .ts-meter__fill { background: var(--danger); }
.ts-meter__goal { position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px; border-radius: 1px; background: var(--ink); }

.ts-comp { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; width: 100%; }
.ts-comp__bar { display: flex; gap: 2px; height: 10px; }
.ts-comp--sm .ts-comp__bar { height: 6px; }
.ts-comp--lg .ts-comp__bar { height: 16px; }
.ts-comp__seg { flex: 1 1 0; min-width: 3px; border-radius: var(--radius-xs); background: var(--ts-cat); }
.ts-comp__empty { flex: 1; border-radius: var(--radius-xs); background: var(--surface-sunken); }
.ts-comp__legend { display: grid; grid-template-columns: auto 1fr auto auto; gap: var(--space-2) var(--space-3); align-items: center; margin: 0; padding: 0; list-style: none; }
.ts-comp__item { display: contents; }
.ts-comp__name { color: var(--ink-soft); }
.ts-comp__val { color: var(--ink); text-align: right; }
.ts-comp__pct { color: var(--ink-muted); text-align: right; min-width: 32px; }
.ts-comp--inline .ts-comp__legend { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); }
.ts-comp--inline .ts-comp__item { display: inline-flex; align-items: center; gap: var(--space-2); }

.ts-legend { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); }

/* linha do tempo — as marcas de hora cruzam o eixo, como as marcas da mira cruzam o anel */
.ts-tl { position: relative; width: 100%; --ts-tl-h: 16px; }
.ts-tl--sm { --ts-tl-h: 8px; }
.ts-tl--lg { --ts-tl-h: 32px; }
.ts-tl__scale { position: relative; height: 14px; margin-bottom: var(--space-2); }
.ts-tl__hour { position: absolute; top: 0; transform: translateX(-50%); color: var(--ink-muted); white-space: nowrap; }
.ts-tl__hour.is-first { transform: none; }
.ts-tl__hour.is-last { transform: translateX(-100%); }
.ts-tl__track { position: relative; height: var(--ts-tl-h); }
.ts-tl__axis { position: absolute; left: 0; right: 0; top: 50%; height: 1px; margin-top: -.5px; background: var(--line-strong); }
.ts-tl__tick { position: absolute; top: -3px; bottom: -3px; width: 1px; margin-left: -.5px; background: var(--line-strong); }
.ts-tl__seg { position: absolute; top: 0; bottom: 0; min-width: 2px; padding: 0; border: 0; border-radius: var(--radius-xs); background: var(--ts-cat); cursor: default; }
button.ts-tl__seg { cursor: pointer; }
.ts-tl__seg--produtivo { --ts-cat: var(--cat-produtivo); }
.ts-tl__seg--neutro { --ts-cat: var(--cat-neutro); }
.ts-tl__seg--distracao { --ts-cat: var(--cat-distracao); }
.ts-tl__seg--ocioso { background: var(--ts-tl-bg, var(--surface-raised)); border-radius: 0; }
.ts-tl__seg--ocioso::before { content: ""; position: absolute; left: 1px; right: 1px; top: 50%; margin-top: -1px; border-top: 2px dashed var(--cat-ocioso); }
.ts-tl__seg:hover, .ts-tl__seg:focus-visible { z-index: 5; outline: 2px solid var(--ink); outline-offset: 1px; box-shadow: none; }
.ts-tl__tip { position: absolute; left: 50%; bottom: calc(100% + 10px); transform: translateX(-50%); display: none; flex-direction: column; align-items: flex-start; padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); background: var(--ink); color: var(--surface-raised); white-space: nowrap; pointer-events: none; z-index: 40; box-shadow: var(--shadow-md); text-align: left; }
.ts-tl__tip.is-start { left: 0; transform: none; }
.ts-tl__tip.is-end { left: auto; right: 0; transform: none; }
.ts-tl__seg:hover .ts-tl__tip, .ts-tl__seg:focus-visible .ts-tl__tip { display: flex; }
.ts-tl__tipname, .ts-tl__tipmeta { opacity: .78; }
.ts-tl__now { position: absolute; top: -6px; bottom: -6px; width: 2px; margin-left: -1px; border-radius: 1px; background: var(--accent); z-index: 3; pointer-events: none; }
.ts-tl__now::before { content: ""; position: absolute; top: -3px; left: -2px; width: 6px; height: 6px; border-radius: var(--radius-full); background: var(--accent); }

.ts-team { --ts-team-cols: minmax(180px, 224px) minmax(0, 1fr) 148px 16px; }
.ts-team__head, .ts-team__row { display: grid; grid-template-columns: var(--ts-team-cols); column-gap: var(--space-5); align-items: center; }
.ts-team__head { padding: var(--space-3) var(--space-5) var(--space-2); color: var(--ink-muted); border-bottom: 1px solid var(--line); }
.ts-team__hcell--end { text-align: left; }
.ts-team__hscale { position: relative; height: 14px; }
.ts-team__nowlabel { position: absolute; top: -3px; transform: translateX(-50%); padding: 3px var(--space-2); border-radius: var(--radius-full); background: var(--accent); color: var(--on-accent); white-space: nowrap; }
.ts-team__rows { margin: 0; padding: 0; list-style: none; }
.ts-team__row { padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--line); color: var(--ink); cursor: pointer; }
.ts-team__rows li:last-child .ts-team__row { border-bottom: 0; border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.ts-team__row:hover { background: var(--surface-hover); --ts-tl-bg: var(--surface-hover); --ts-ring: var(--surface-hover); }
.ts-team__row:focus-visible { box-shadow: inset 0 0 0 2px var(--accent); }
.ts-team__person { display: flex; align-items: center; gap: var(--space-3); min-width: 0; }
.ts-team__who { display: flex; flex-direction: column; min-width: 0; }
.ts-team__name { display: flex; align-items: center; gap: var(--space-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ts-team__name .ts-sev .ts-icon { width: 16px; height: 16px; }
.ts-team__sub { display: flex; gap: var(--space-2); color: var(--ink-muted); white-space: nowrap; }
.ts-team__detail { color: var(--ink-muted); }
.ts-team__metrics { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
.ts-team__worked { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-2); }
.ts-team__worked .caption { color: var(--ink-muted); }
.ts-team__go { color: var(--ink-disabled); }
.ts-team__row:hover .ts-team__go { color: var(--accent-ink); }

.ts-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--space-2); margin-top: var(--space-6); }
.ts-week__day { display: flex; flex-direction: column; align-items: stretch; gap: var(--space-2); padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-raised); color: var(--ink); text-align: left; cursor: pointer; min-width: 0; }
.ts-week__day:hover:not(:disabled) { border-color: var(--border); }
.ts-week__day.is-selected { border-color: var(--accent); background: var(--accent-soft); box-shadow: inset 0 0 0 1px var(--accent); }
.ts-week__day:disabled { cursor: default; background: none; border-style: dashed; }
.ts-week__label { color: var(--ink-muted); }
.ts-week__day.is-selected .ts-week__label { color: var(--accent-ink); }
.ts-week__wd { color: var(--ink); font-weight: 600; }
.ts-week__day.is-selected .ts-week__wd { color: var(--accent-ink); }
.ts-week__none { height: 6px; border-top: 2px dashed var(--line-strong); margin-top: 2px; height: 4px; }
.ts-week__val { color: var(--ink); min-height: 20px; }
.ts-week__bal { color: var(--ink-muted); margin-top: calc(var(--space-2) * -1); }

.ts-dial { position: relative; flex: none; }
.ts-dial svg { display: block; }
.ts-dial__track { stroke: var(--line); }
.ts-dial__ticks { stroke: var(--line-strong); }
.ts-dial__arc { stroke: var(--brand); }
.ts-dial__center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0; }
.ts-dial__value { color: var(--ink); line-height: 1; }
.ts-dial__of { color: var(--ink-muted); margin-top: 2px; }

.ts-table { border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface-raised); overflow: hidden; }
.ts-table--bare { border: 0; border-radius: 0; background: none; }
.ts-table table { width: 100%; border-collapse: collapse; }
.ts-table th { height: 40px; padding: 0 var(--space-3); color: var(--ink-muted); text-align: left; border-bottom: 1px solid var(--line); white-space: nowrap; }
.ts-table td { height: 56px; padding: var(--space-2) var(--space-3); color: var(--ink-soft); border-bottom: 1px solid var(--line); vertical-align: middle; }
.ts-table--compact td { height: 44px; }
.ts-table th:first-child, .ts-table td:first-child { padding-left: var(--space-5); }
.ts-table th:last-child, .ts-table td:last-child { padding-right: var(--space-5); }
.ts-table tbody tr:last-child td { border-bottom: 0; }
.ts-table .is-right { text-align: right; }
.ts-table .is-center { text-align: center; }
.ts-table tr.is-clickable { cursor: pointer; }
.ts-table tr.is-clickable:hover td { background: var(--surface-hover); }
.ts-table tr.is-clickable:hover { --ts-ring: var(--surface-hover); }
.ts-table tr.is-clickable:focus-visible { box-shadow: none; outline: 2px solid var(--accent); outline-offset: -2px; }
.ts-table tfoot td { height: 48px; border-top: 1px solid var(--line-strong); border-bottom: 0; color: var(--ink); background: var(--surface-sunken); }
.ts-table__sort { display: inline-flex; align-items: center; gap: var(--space-1); padding: 0; border: 0; background: none; color: inherit; cursor: pointer; border-radius: var(--radius-xs); }
.ts-table__sort:hover, .ts-table__sort.is-active { color: var(--ink); }
.ts-table__empty { padding: var(--space-4); }
.ts-cellstrong { color: var(--ink); font-weight: 600; }
.ts-cellmuted { color: var(--ink-muted); }
.ts-cellsub { color: var(--ink-muted); }
.ts-personcell { display: flex; align-items: center; gap: var(--space-3); min-width: 0; }
.ts-personcell__text { display: flex; flex-direction: column; min-width: 0; }
.ts-personcell__text > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ts-workedcell { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: var(--space-3); }
.ts-devicon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--radius-md); background: var(--surface-sunken); color: var(--ink-soft); flex: none; }
.ts-tablefoot { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }

.ts-usage { margin: 0; padding: 0; list-style: none; }
.ts-usage__row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--space-2) var(--space-3); padding: var(--space-3) 0; border-bottom: 1px solid var(--line); }
.ts-usage__row:last-child { border-bottom: 0; padding-bottom: 0; }
.ts-usage__row:first-child { padding-top: 0; }
.ts-usage__name { display: flex; align-items: baseline; gap: var(--space-2); min-width: 0; color: var(--ink); }
.ts-usage__name .body { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ts-usage__detail { color: var(--ink-muted); flex: none; }
.ts-usage__bar { grid-column: 1 / -1; display: block; height: 6px; }
.ts-usage__fill { display: block; height: 100%; min-width: 3px; border-radius: var(--radius-xs); background: var(--ts-cat); }
.ts-usage__time { color: var(--ink); text-align: right; }
.ts-usage__cat { display: inline-flex; align-items: center; gap: var(--space-2); height: var(--target-min); padding: 0 var(--space-2); border: 1px solid var(--line-strong); border-radius: var(--radius-full); background: none; color: var(--ink-soft); cursor: pointer; white-space: nowrap; }
.ts-usage__cat:hover { background: var(--surface-hover); border-color: var(--border); color: var(--ink); }
.ts-usage__cat > .ts-icon { color: var(--ink-muted); }

.ts-ruler { margin-bottom: var(--space-6); }
.ts-ruler__goal { position: relative; display: inline-flex; align-items: baseline; gap: var(--space-2); transform: translateX(-50%); margin-bottom: var(--space-3); white-space: nowrap; color: var(--ink); }
.ts-ruler__goal .caption { color: var(--ink-muted); }
.ts-ruler__goal .label { font-weight: 600; }
.ts-ruler__bar { position: relative; height: 36px; }
.ts-ruler__zone { position: absolute; top: 0; bottom: 0; display: flex; align-items: center; padding: 0 var(--space-3); overflow: hidden; white-space: nowrap; border-right: 2px solid var(--surface-raised); }
.ts-ruler__zone:first-child { border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
.ts-ruler__zone--burn { border-right: 0; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.ts-ruler__zone--low, .ts-ruler__zone--over { background: var(--warning-soft); color: var(--warning); }
.ts-ruler__zone--ok { background: var(--accent-soft); color: var(--accent-ink); }
.ts-ruler__zone--burn { background: var(--danger-soft); color: var(--danger); }
.ts-ruler__mark { position: absolute; top: -6px; bottom: -6px; width: 2px; margin-left: -2px; border-radius: 1px; background: var(--ink-muted); }
.ts-ruler__mark--goal { width: 3px; margin-left: -1.5px; background: var(--ink); top: -8px; bottom: -4px; }
.ts-ruler__labels { position: relative; height: 40px; margin-top: var(--space-3); }
.ts-ruler__label { position: absolute; top: 0; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; white-space: nowrap; }
.ts-ruler__label .label { color: var(--ink); }
.ts-ruler__label .caption { color: var(--ink-muted); }
.ts-ruler__label--goal .label { font-weight: 600; }
.ts-ruler__end { position: absolute; top: 3px; color: var(--ink-muted); }
.ts-ruler__end--max { transform: translateX(-100%); }

/* ───────────── estrutura ───────────── */
.ts-app { display: flex; align-items: stretch; min-height: 100%; background: var(--surface); color: var(--ink); }
/* o trilho fica preso à janela e a barra superior gruda no topo; o conteúdo rola com a página */
.ts-app > .ts-rail { position: sticky; top: 0; height: 100vh; align-self: flex-start; }
.ts-app__main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ts-app__content { flex: 1; display: flex; flex-direction: column; gap: var(--space-6); padding: var(--space-6); min-width: 0; }

.ts-rail { display: flex; flex-direction: column; width: var(--rail-width); padding: var(--space-4) var(--space-3); background: var(--rail); color: var(--on-rail-muted); flex: none; --ts-ring: var(--rail); }
.ts-rail.is-collapsed { width: var(--rail-collapsed); }
.ts-rail :where(button, a):focus-visible { box-shadow: 0 0 0 2px var(--rail), 0 0 0 4px var(--accent); }
.ts-rail__brand { display: flex; align-items: center; justify-content: space-between; height: var(--control-md); padding: 0 var(--space-1) 0 var(--space-2); margin-bottom: var(--space-2); }
.ts-rail.is-collapsed .ts-rail__brand { justify-content: center; padding: 0; }
.ts-rail__toggle { display: grid; place-items: center; width: var(--control-sm); height: var(--control-sm); padding: 0; border: 0; border-radius: var(--radius-sm); background: none; color: var(--on-rail-muted); cursor: pointer; flex: none; }
.ts-rail__toggle:hover { background: var(--rail-raised); color: var(--on-rail); }
.ts-rail__scroll { flex: 1; min-height: 0; margin: 0 calc(var(--space-3) * -1); padding: 0 var(--space-3) var(--space-1); overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--rail-line) transparent; }
.ts-rail ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 2px; }
.ts-rail__grouplabel { padding: 0 var(--space-3); margin: var(--space-5) 0 var(--space-2); color: var(--on-rail-muted); }
.ts-rail__rule { height: 1px; margin: var(--space-3) var(--space-2); background: var(--rail-line); }
.ts-rail__item { position: relative; display: flex; align-items: center; gap: var(--space-3); height: var(--control-md); padding: 0 var(--space-3); border-radius: var(--radius-md); color: var(--on-rail-muted); text-decoration: none; }
.ts-rail.is-collapsed .ts-rail__item { justify-content: center; padding: 0; }
.ts-rail__item:hover { background: var(--rail-raised); color: var(--on-rail); }
.ts-rail__item.is-active { background: var(--rail-raised); color: var(--on-rail); }
.ts-rail__item.is-active .ts-icon { color: var(--brand); }
.ts-rail__item.is-active::before { content: ""; position: absolute; left: calc(var(--space-3) * -1); top: 50%; width: 3px; height: 18px; margin-top: -9px; border-radius: 0 var(--radius-full) var(--radius-full) 0; background: var(--brand); }
.ts-rail__label { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ts-rail__count { min-width: 20px; height: 18px; padding: 0 var(--space-1); border-radius: var(--radius-full); background: var(--danger); color: var(--on-danger); display: grid; place-items: center; }
.ts-rail.is-collapsed .ts-rail__count { position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px; }
.ts-rail__foot { display: flex; flex-direction: column; gap: var(--space-3); padding-top: var(--space-3); margin-top: var(--space-3); border-top: 1px solid var(--rail-line); }
.ts-rail__theme { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; padding: 2px; border-radius: var(--radius-md); background: var(--rail-raised); }
.ts-rail__themeopt { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); height: 26px; border: 0; border-radius: var(--radius-sm); background: none; color: var(--on-rail-muted); cursor: pointer; }
.ts-rail__themeopt:hover { color: var(--on-rail); }
.ts-rail__themeopt.is-on { background: var(--rail); color: var(--on-rail); }
.ts-rail__mini { display: flex; flex-direction: column; align-items: center; gap: var(--space-1); }
.ts-rail__user { display: flex; align-items: center; gap: var(--space-3); padding: 0 var(--space-1) 0 var(--space-2); min-height: var(--control-md); }
.ts-rail.is-collapsed .ts-rail__user { justify-content: center; padding: 0; }
.ts-rail__userinfo { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.ts-rail__username { color: var(--on-rail); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ts-rail__userrole { color: var(--on-rail-muted); }

.ts-topbar { display: flex; align-items: center; gap: var(--space-5); height: var(--topbar-height); padding: 0 var(--space-6); background: var(--surface-raised); border-bottom: 1px solid var(--line); flex: none;  position: sticky; top: 0; z-index: 20; }
.ts-topbar__crumbs { display: flex; align-items: center; gap: var(--space-2); margin: 0; padding: 0; list-style: none; color: var(--ink-muted); white-space: nowrap; }
.ts-topbar__crumbs li + li::before { content: "/"; margin-right: var(--space-2); color: var(--ink-disabled); }
.ts-topbar__crumbs li[aria-current] { color: var(--ink); }
.ts-topbar__search { display: flex; align-items: center; gap: var(--space-2); width: 340px; max-width: 40%; height: var(--control-md); padding: 0 var(--space-2) 0 var(--space-3); border: 0; border-radius: var(--radius-md); background: var(--surface-sunken); color: var(--ink-muted); cursor: pointer; text-align: left; }
.ts-topbar__search:hover { color: var(--ink); background: var(--surface-hover); box-shadow: inset 0 0 0 1px var(--line-strong); }
.ts-topbar__searchtext { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ts-topbar__keys { display: inline-flex; flex: none; }
.ts-topbar__end { margin-left: auto; display: flex; align-items: center; gap: var(--space-3); }
.ts-topbar__live { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--ink-muted); white-space: nowrap; }
.ts-topbar__livelabel { color: var(--ink-soft); }
.ts-topbar__pulse { position: relative; width: 8px; height: 8px; border-radius: var(--radius-full); background: var(--success); }
@media (prefers-reduced-motion: no-preference) {
  .ts-topbar__pulse::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: var(--success); animation: ts-ping 2s ease-out infinite; }
}
@keyframes ts-ping { 0% { transform: scale(1); opacity: .6; } 70%, 100% { transform: scale(2.6); opacity: 0; } }

.ts-pagehead { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: var(--space-4) var(--space-6); }
.ts-pagehead__text { min-width: 0; }
.ts-pagehead__eyebrow { margin-bottom: var(--space-2); color: var(--ink-muted); }
.ts-pagehead__title { margin: 0; color: var(--ink); }
.ts-pagehead__desc { margin: 2px 0 0; color: var(--ink-muted); }
.ts-pagehead__actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2); margin-left: auto; }

.ts-panel { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface-raised); }
.ts-panel__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); min-height: 56px; padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--line); }
.ts-panel__titles { min-width: 0; }
.ts-panel__title { margin: 0; color: var(--ink); }
.ts-panel__desc { margin: 0; color: var(--ink-muted); }
.ts-panel__actions { display: flex; align-items: center; gap: var(--space-2); flex: none; }
.ts-panel__body { padding: var(--space-5); min-width: 0; }
.ts-panel--flush > .ts-panel__body { padding: 0; }
.ts-panel__foot { padding: var(--space-3) var(--space-5); border-top: 1px solid var(--line); color: var(--ink-muted); }

.ts-tabs { display: flex; gap: var(--space-6); border-bottom: 1px solid var(--line); overflow-x: auto; }
.ts-tabs__tab { display: inline-flex; align-items: center; gap: var(--space-2); height: 40px; padding: 0 2px; margin-bottom: -1px; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--ink-muted); cursor: pointer; white-space: nowrap; border-radius: var(--radius-xs) var(--radius-xs) 0 0; }
.ts-tabs__tab:hover { color: var(--ink); }
.ts-tabs__tab.is-active { color: var(--ink); border-bottom-color: var(--accent); }
.ts-tabs__count { min-width: 18px; height: 18px; padding: 0 var(--space-1); border-radius: var(--radius-full); background: var(--surface-sunken); color: var(--ink-soft); display: grid; place-items: center; }
.ts-tabs__tab.is-active .ts-tabs__count { background: var(--accent-soft); color: var(--accent-ink); }

.ts-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-3); }
.ts-toolbar__spacer { flex: 1; }
.ts-toolbar .ts-field { flex: none; }

.ts-cmd { width: min(600px, 100%); border: 1px solid var(--line); border-radius: var(--radius-xl); background: var(--surface-raised); box-shadow: var(--shadow-lg); overflow: hidden; color: var(--ink); }
.ts-cmd__input { display: flex; align-items: center; gap: var(--space-3); height: 52px; padding: 0 var(--space-4); border-bottom: 1px solid var(--line); color: var(--ink-muted); }
.ts-cmd__input input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; color: var(--ink); box-shadow: none !important; }
.ts-cmd__input input::placeholder { color: var(--ink-muted); opacity: 1; }
.ts-cmd__list { padding: var(--space-2); }
.ts-cmd__grouplabel { padding: var(--space-2) var(--space-3) var(--space-1); color: var(--ink-muted); }
.ts-cmd__item { display: flex; align-items: center; gap: var(--space-3); height: 40px; padding: 0 var(--space-3); border-radius: var(--radius-md); cursor: pointer; }
.ts-cmd__item:hover { background: var(--surface-hover); }
.ts-cmd__item.is-active { background: var(--accent-soft); --ts-ring: var(--accent-soft); }
.ts-cmd__icon { display: grid; place-items: center; width: 24px; height: 24px; color: var(--ink-muted); flex: none; }
.ts-cmd__label { color: var(--ink); white-space: nowrap; }
.ts-cmd__hint { flex: 1; min-width: 0; color: var(--ink-muted); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ts-cmd__keys { margin-left: auto; display: inline-flex; flex: none; }
.ts-cmd__foot { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); padding: var(--space-3) var(--space-4); border-top: 1px solid var(--line); background: var(--surface-sunken); color: var(--ink-muted); }
.ts-cmd__foot span { display: inline-flex; align-items: center; gap: var(--space-2); }

/* ───────────── retorno ───────────── */
.ts-empty { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); padding: var(--space-10) var(--space-6); text-align: center; }
.ts-empty__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-full); background: var(--surface-sunken); color: var(--ink-muted); flex: none; }
.ts-empty__title { margin: 0; color: var(--ink); }
.ts-empty__desc { margin: 2px 0 0; color: var(--ink-muted); max-width: 46ch; }
.ts-empty--compact { flex-direction: row; align-items: center; padding: 0; text-align: left; }
.ts-empty--compact .ts-empty__icon { width: 36px; height: 36px; }
.ts-empty--compact .ts-empty__text { flex: 1; min-width: 0; }

.ts-banner { display: flex; align-items: flex-start; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: var(--accent-soft); color: var(--ink); }
.ts-banner__icon { margin-top: 2px; color: var(--accent-ink); }
.ts-banner__text { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap: 0 var(--space-2); }
.ts-banner__text span { color: var(--ink-soft); }
.ts-banner__action { flex: none; align-self: center; }
.ts-banner--success { background: var(--success-soft); }
.ts-banner--success .ts-banner__icon { color: var(--success); }
.ts-banner--warning { background: var(--warning-soft); }
.ts-banner--warning .ts-banner__icon { color: var(--warning); }
.ts-banner--danger { background: var(--danger-soft); }
.ts-banner--danger .ts-banner__icon { color: var(--danger); }

.ts-toast { display: flex; align-items: flex-start; gap: var(--space-3); width: 380px; max-width: 100%; padding: var(--space-3) var(--space-3) var(--space-3) var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface-raised); box-shadow: var(--shadow-md); color: var(--ink); }
.ts-toast__icon { margin-top: 2px; color: var(--success); }
.ts-toast--danger .ts-toast__icon { color: var(--danger); }
.ts-toast--accent .ts-toast__icon { color: var(--accent-ink); }
.ts-toast__text { flex: 1; min-width: 0; }
.ts-toast__text p { margin: 0; }
.ts-toast__text .caption { color: var(--ink-muted); }
.ts-toast__action { align-self: center; flex: none; }

.ts-scrim { position: relative; display: grid; place-items: center; padding: var(--space-8); background: var(--scrim); }
.ts-scrim--fixed { position: fixed; inset: 0; z-index: 60; overflow: auto; }
.ts-dialog { width: min(520px, 100%); border: 1px solid var(--line); border-radius: var(--radius-xl); background: var(--surface-raised); box-shadow: var(--shadow-lg); color: var(--ink); }
.ts-dialog--sm { width: min(420px, 100%); }
.ts-dialog__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4); padding: var(--space-5) var(--space-4) 0 var(--space-6); }
.ts-dialog__head h2 { margin: 0; }
.ts-dialog__desc { margin: var(--space-1) 0 0; color: var(--ink-muted); }
.ts-dialog__body { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-5) var(--space-6) var(--space-6); }
.ts-dialog__foot { display: flex; justify-content: flex-end; gap: var(--space-2); padding: var(--space-4) var(--space-6); border-top: 1px solid var(--line); }
.ts-steps { margin: 0; padding: 0; list-style: none; counter-reset: ts-step; display: flex; flex-direction: column; gap: var(--space-4); }
.ts-steps > li { position: relative; padding-left: var(--space-10); counter-increment: ts-step; }
.ts-steps > li::before { content: counter(ts-step); position: absolute; left: 0; top: 0; width: 24px; height: 24px; border-radius: var(--radius-full); background: var(--accent-soft); color: var(--accent-ink); display: grid; place-items: center; font-size: 12px; font-weight: 600; }
.ts-steps > li > p { margin: 0 0 var(--space-2); }

/* ───────────── pessoas ───────────── */
.ts-collab { position: relative; display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface-raised); min-width: 0; }
.ts-collab:hover { border-color: var(--border); }
.ts-collab__hit { position: absolute; inset: 0; padding: 0; border: 0; border-radius: inherit; background: none; cursor: pointer; }
.ts-collab__head { display: flex; align-items: center; gap: var(--space-3); }
.ts-collab__id { flex: 1; min-width: 0; }
.ts-collab__id h3 { margin: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.ts-collab__id p { margin: 0; color: var(--ink-muted); }
.ts-collab__hours { display: flex; align-items: baseline; gap: var(--space-2); margin-top: var(--space-1); }
.ts-collab__goal { color: var(--ink-muted); }
.ts-collab__balance { margin-left: auto; padding: 1px var(--space-2); border-radius: var(--radius-full); background: var(--success-soft); color: var(--success); }
.ts-collab__balance.is-neg { background: var(--danger-soft); color: var(--danger); }
.ts-collab__comp { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--space-3); }
.ts-collab__comp .caption { color: var(--ink-muted); }
.ts-collab__empty { display: flex; flex-direction: column; justify-content: center; gap: var(--space-1); flex: 1; min-height: 84px; margin-top: var(--space-1); color: var(--ink-muted); }
.ts-collab__empty .body-strong { color: var(--ink-soft); }
.ts-collab__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--line); min-height: 29px; }
.ts-collab__app { color: var(--ink-muted); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; min-width: 0; }
.ts-collab__app.ts-cat { color: var(--ink-soft); }
.ts-cardgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--space-4); }

.ts-alert { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: flex-start; gap: var(--space-3); padding: var(--space-3) var(--space-3) var(--space-3) var(--space-5); border-bottom: 1px solid var(--line); }
.ts-alert:last-child { border-bottom: 0; }
.ts-alert > .ts-sev { margin-top: 2px; }
.ts-alert__title { margin: 0; color: var(--ink); }
.ts-alert__detail { margin: 0; color: var(--ink-soft); }
.ts-alert__meta { display: flex; flex-wrap: wrap; gap: 0 var(--space-3); margin: var(--space-1) 0 0; color: var(--ink-muted); }
.ts-alert__who { color: var(--ink-soft); font-weight: 600; }
.ts-alert__actions { display: flex; gap: 2px; }

/* ───────────── IA ───────────── */
.ts-insight { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface-raised); }
.ts-insight__head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); min-height: 56px; padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--line); }
.ts-insight__titles { display: flex; align-items: center; gap: var(--space-3); min-width: 0; }
.ts-insight__titles h2 { margin: 0; }
.ts-insight__main { display: flex; flex-direction: column; gap: var(--space-5); padding: var(--space-5); flex: 1; }
.ts-insight__top { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-5); align-items: center; }
.ts-insight__top--loading { padding: var(--space-5); }
.ts-insight__read { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
.ts-insight__scorelabel { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: 0; color: var(--ink-muted); }
.ts-insight__summary { margin: 0; color: var(--ink); }
.ts-insight__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: var(--space-4); padding-top: var(--space-5); border-top: 1px solid var(--line); }
.ts-insight__coltitle { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-2); }
.ts-insight__col--good .ts-insight__coltitle { color: var(--success); }
.ts-insight__col--risk .ts-insight__coltitle { color: var(--warning); }
.ts-insight__col--tip .ts-insight__coltitle { color: var(--accent-ink); }
.ts-insight__col ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--space-1); }
.ts-insight__col li { position: relative; padding-left: var(--space-3); color: var(--ink-soft); }
.ts-insight__col li::before { content: ""; position: absolute; left: 0; top: 9px; width: 4px; height: 4px; border-radius: var(--radius-full); background: var(--ink-disabled); }
.ts-insight__anom { display: flex; align-items: center; gap: var(--space-2); margin: 0; color: var(--ink-muted); }
.ts-insight__foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-2) var(--space-4); padding: var(--space-2) var(--space-3) var(--space-2) var(--space-5); border-top: 1px solid var(--line); color: var(--ink-muted); }
.ts-insight__fb { display: inline-flex; align-items: center; gap: var(--space-1); }
.ts-insight__loading { display: flex; flex-direction: column; gap: var(--space-3); padding-top: var(--space-2); }
.ts-insight__loading p { margin: 0; color: var(--ink-muted); }
.ts-insight > .ts-empty, .ts-insight > .ts-banner { margin: var(--space-5); }
.ts-insight > .ts-empty { margin: 0; }

/* ───────────── telas ───────────── */
.ts-ov__top { display: grid; grid-template-columns: minmax(0, 1fr) 372px; gap: var(--space-6); align-items: stretch; }
.ts-ov__lead { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); flex: 1; }
.ts-ov__summary .ts-statrow { border-top: 1px solid var(--line); }
.ts-ov__teams { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.ts-ov__team { display: flex; flex-direction: column; gap: var(--space-1); padding: var(--space-3) var(--space-5) var(--space-4); border-left: 1px solid var(--line); min-width: 0; }
.ts-ov__team:first-child { border-left: 0; }
.ts-ov__team > .caption { color: var(--ink-muted); }
.ts-ov__teamval { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 var(--space-2); margin-bottom: var(--space-1) !important; color: var(--ink); }
.ts-ov__teamval .caption { color: var(--ink-muted); }
.ts-ov__summary > .ts-panel__body { display: flex; flex-direction: column; height: 100%; }
.ts-ov__hero, .ts-ov__comp { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-5); }
.ts-ov__comp { border-left: 1px solid var(--line); gap: var(--space-3); }
.ts-ov__hero .caption, .ts-ov__comp > .caption { color: var(--ink-muted); }
.ts-ov__figure { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 var(--space-3); color: var(--ink); }
.ts-ov__figure .body { color: var(--ink-muted); }
.ts-ov__hero .ts-meter { margin-top: var(--space-2); }

.ts-person__head { display: flex; align-items: center; gap: var(--space-4); flex-wrap: wrap; }
.ts-person__id { flex: 1; min-width: 0; }
.ts-person__meta { display: flex; flex-wrap: wrap; gap: 0 var(--space-3); color: var(--ink-muted); }
.ts-person__meta span + span { padding-left: var(--space-3); border-left: 1px solid var(--line-strong); }
.ts-person__now { display: flex; align-items: center; gap: var(--space-2); margin-top: var(--space-1) !important; color: var(--ink-muted); }
.ts-person__cols { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: var(--space-6); align-items: stretch; }
.ts-person__cols--even { grid-template-columns: 1fr 1fr; }

.ts-playback { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: var(--space-6); align-items: stretch; }
.ts-playback__stage { display: grid; place-items: center; padding: var(--space-5); border-radius: var(--radius-md); background: var(--rail); }
.ts-playback__side { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.ts-playback__controls { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.ts-playback__time { color: var(--ink-soft); margin-right: auto; }
.ts-playback__hint { color: var(--ink-muted); margin-top: var(--space-2) !important; }
.ts-playback__frames { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.ts-frame { margin: 0; display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
.ts-frame__screen { position: relative; display: block; aspect-ratio: 16 / 10; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface-sunken); overflow: hidden; }
.ts-frame__bar { position: absolute; left: 0; right: 0; top: 0; height: 14%; background: var(--line-strong); }
.ts-frame__side { position: absolute; left: 0; top: 14%; bottom: 0; width: 22%; background: var(--line); }
.ts-frame__lines { position: absolute; left: 30%; right: 8%; top: 30%; display: flex; flex-direction: column; gap: 5px; }
.ts-frame__lines i { display: block; height: 3px; border-radius: 2px; background: var(--line-strong); }
.ts-frame figcaption { display: flex; flex-direction: column; align-items: flex-start; gap: 0; color: var(--ink-muted); min-width: 0; }
.ts-frame--large figcaption { flex-direction: row; align-items: center; gap: var(--space-2); }
.ts-frame figcaption .ts-cat { max-width: 100%; overflow: hidden; }
.ts-frame--large { width: min(100%, 420px); }
.ts-frame--large .ts-frame__screen { border-color: var(--rail-line); background: var(--rail-raised); }
.ts-frame--large .ts-frame__bar { background: var(--rail-line); }
.ts-frame--large .ts-frame__side { background: var(--rail-line); opacity: .6; }
.ts-frame--large .ts-frame__lines { gap: 12px; }
.ts-frame--large .ts-frame__lines i { height: 6px; background: var(--rail-line); }
.ts-frame--large figcaption, .ts-frame--large figcaption .ts-cat { color: var(--on-rail-muted); }

.ts-teamgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); align-items: start; }
.ts-memberlist { margin: 0; padding: 0; list-style: none; }
.ts-memberlist li { display: grid; grid-template-columns: auto minmax(0, 1fr) 172px; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--line); }
.ts-memberlist li:last-child { border-bottom: 0; }
.ts-memberlist__none { margin: 0; padding: var(--space-4) var(--space-5); color: var(--ink-muted); }
.ts-teamfoot { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; align-items: center; gap: var(--space-3); }

.ts-roles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); padding: var(--space-4) var(--space-5); border: 1px dashed var(--line-strong); border-radius: var(--radius-lg); }
.ts-roles p { margin: 0; }
.ts-roles .body-strong { display: flex; align-items: center; gap: var(--space-2); color: var(--ink); }
.ts-roles .caption { margin-top: 2px; color: var(--ink-muted); }

.ts-settings { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: var(--space-6); align-items: start; }
.ts-settings__nav { position: sticky; top: var(--space-6); display: flex; flex-direction: column; gap: 2px; }
.ts-settings__nav a { display: flex; align-items: center; gap: var(--space-2); height: var(--control-md); padding: 0 var(--space-3); border-radius: var(--radius-md); color: var(--ink-muted); text-decoration: none; }
.ts-settings__nav a:hover { background: var(--surface-hover); color: var(--ink); }
.ts-settings__nav a.is-active { background: var(--accent-soft); color: var(--accent-ink); }
.ts-settings__body { display: flex; flex-direction: column; gap: var(--space-6); min-width: 0; }
.ts-formgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.ts-formgrid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ts-formgrid--rule { margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--line); }
.ts-formstack { display: flex; flex-direction: column; gap: var(--space-5); max-width: 520px; }
.ts-formstack .ts-seg { align-self: flex-start; }
.ts-suggest { margin: var(--space-4) var(--space-5) 0; padding: var(--space-4); border-radius: var(--radius-md); background: var(--accent-soft); }
.ts-suggest__title { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-3) !important; color: var(--ink); }
.ts-suggest .ts-ai { background: var(--surface-raised); }
.ts-suggest ul { display: flex; flex-direction: column; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.ts-suggest li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--space-2) var(--space-4); padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); background: var(--surface-raised); }
.ts-suggest__why { grid-column: 1 / -1; }
.ts-suggest__app { display: flex; flex-direction: column; min-width: 0; }
.ts-suggest__app .caption, .ts-suggest__why { color: var(--ink-muted); }
.ts-suggest__acts { display: inline-flex; align-items: center; gap: var(--space-1); }
.ts-addrule { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--space-3); padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--line); }
.ts-savebar { position: sticky; bottom: var(--space-4); display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-3) var(--space-3) var(--space-5); border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface-raised); box-shadow: var(--shadow-md); }
.ts-savebar .label { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--ink); }
.ts-savebar__dot { width: 8px; height: 8px; border-radius: var(--radius-full); background: var(--warning-mark); }

.ts-login { display: grid; grid-template-columns: minmax(0, 46fr) minmax(0, 54fr); min-height: 100%; background: var(--surface-raised); color: var(--ink); }
.ts-login__brand { position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: var(--space-10); padding: var(--space-12); background: var(--rail); color: var(--on-rail); overflow: hidden; }
.ts-login__mira { position: absolute; left: 6%; top: -9%; width: 108%; height: auto; pointer-events: none; }
.ts-login__ring { stroke: var(--rail-raised); }
.ts-login__dash { stroke: var(--brand); }
.ts-login__pitch { position: relative; max-width: 440px; }
.ts-login__pitch .display { color: var(--on-rail); text-wrap: balance; }
.ts-login__pitch .body { margin-top: var(--space-4) !important; color: var(--on-rail-muted); max-width: 36ch; }
.ts-login__endorse { position: relative; display: flex; align-items: center; gap: var(--space-3); color: var(--on-rail-muted); }
.ts-login__endorse img { display: block; height: 30px; width: auto; }
.ts-login__main { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-12); padding: var(--space-12); }
.ts-login__form { display: flex; flex-direction: column; gap: var(--space-5); width: min(380px, 100%); }
.ts-login__titles { margin-top: var(--space-4); }
.ts-login__titles .body { margin-top: var(--space-1) !important; color: var(--ink-muted); }
.ts-login__form .ts-btn { margin-top: var(--space-2); }
.ts-login__note { color: var(--ink-muted); }