/* ============================================================
   MedCare — Painel TV do Centro Cirúrgico (/centro-cirurgico/painel-tv)
   Identidade MedCare (teal + IBM Plex, medcare-tokens.css) desenhada para
   TV de parede: tudo prefixado por .tvcc, EmptyLayout, sem chrome do YNEX.

   Tema: ESCURO por padrão, independente do data-theme-mode do sistema —
   a TV fica ligada o dia inteiro e não herda a preferência de quem logou.
   O botão de tema aplica .tvcc-light (persistido em localStorage pela página).
   Por isso os tokens são locais (--tv-*) com os MESMOS valores da paleta
   dark/light de medcare-tokens.css, e não var(--mc-*), que flipam junto
   com o tema do sistema.

   Escala: unidade fluida --u = 1px na largura de referência de 1600.
   A composição inteira (fontes, paddings, raios) cresce/encolhe na mesma
   proporção — em TV 1080p (1920) tudo renderiza a 1.2x sem media query.
   Não usa .mc-scaled/zoom: o painel é altura-fixa (100dvh) e zoom em
   container com viewport units estoura a altura.
   ============================================================ */

.tvcc {
    /* unidade fluida: 1px @ 1600 de largura */
    --u: clamp(0.55px, 0.0625vw, 1.75px);

    /* ---- paleta dark (mesmos valores do [data-theme-mode="dark"] dos tokens) ---- */
    --tv-bg:          #070e11;
    --tv-surface:     #0f1a1f;
    --tv-surface-2:   #15242a;
    --tv-surface-3:   #1c2e35;
    --tv-border:      #213339;
    --tv-border-2:    #31474f;
    --tv-text:        #e8f0f2;
    --tv-text-2:      #a5b9c0;
    --tv-text-3:      #6d838b;
    --tv-brand:       #2bb7bc;
    --tv-brand-2:     #3acace;
    --tv-brand-soft:  #0f302f;
    --tv-brand-ink:   #04201f;
    --tv-grad:        linear-gradient(135deg, #07484b, #0d888c);
    --tv-success:     #33bd77;  --tv-success-soft: #12301f;
    --tv-warning:     #dda23f;  --tv-warning-soft: #2c2412;
    --tv-danger:      #ee6a5f;  --tv-danger-soft:  #2d1917;
    --tv-info:        #5c9af1;  --tv-info-soft:    #112238;
    --tv-purple:      #a58bea;  --tv-purple-soft:  #201a33;
    --tv-slate:       #8ea3ab;  --tv-slate-soft:   #1a262c;
    --tv-shadow:      0 1px 2px rgba(0,0,0,.35), 0 18px 40px -18px rgba(0,0,0,.6);

    position: fixed;
    inset: 0;
    z-index: 50;
    display: grid;
    grid-template-rows: auto auto 1fr auto;
    background: var(--tv-bg);
    color: var(--tv-text);
    font-family: var(--mc-font-sans, 'IBM Plex Sans', system-ui, sans-serif);
    font-size: calc(var(--u) * 13.5);
    line-height: 1.35;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
}

/* ---- paleta clara (mesmos valores do :root dos tokens) ---- */
.tvcc.tvcc-light {
    --tv-bg:          #eef2f4;
    --tv-surface:     #ffffff;
    --tv-surface-2:   #f5f8f9;
    --tv-surface-3:   #e9eff1;
    --tv-border:      #e4ebee;
    --tv-border-2:    #d4dee2;
    --tv-text:        #0f2229;
    --tv-text-2:      #4c6068;
    --tv-text-3:      #82989f;
    --tv-brand:       #0d888c;
    --tv-brand-2:     #0a6c70;
    --tv-brand-soft:  #dbf0f0;
    --tv-brand-ink:   #ffffff;
    --tv-grad:        linear-gradient(135deg, #0a6c70, #0d888c);
    --tv-success:     #1c9a5e;  --tv-success-soft: #e0f3ea;
    --tv-warning:     #c07c13;  --tv-warning-soft: #f9edd6;
    --tv-danger:      #d24a3f;  --tv-danger-soft:  #fae5e2;
    --tv-info:        #2c6fce;  --tv-info-soft:    #e3edfb;
    --tv-purple:      #7856ce;  --tv-purple-soft:  #ebe4fb;
    --tv-slate:       #5b7079;  --tv-slate-soft:   #e9eff1;
    --tv-shadow:      0 1px 2px rgba(15,34,41,.05), 0 14px 34px -14px rgba(15,34,41,.16);
}

/* Ícone Material Symbols — a fonte usa o nome do ícone como conteúdo. */
.tvcc .tvcc-ico {
    font-family: 'Material Symbols Rounded';
    font-weight: normal;
    font-style: normal;
    font-size: calc(var(--u) * 19);
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    flex: none;
    user-select: none;
}

/* Tons por status: componentes consomem --tone/--tone-soft. */
.tvcc .tn-blue   { --tone: var(--tv-info);    --tone-soft: var(--tv-info-soft); }
.tvcc .tn-teal   { --tone: var(--tv-brand);   --tone-soft: var(--tv-brand-soft); }
.tvcc .tn-amber  { --tone: var(--tv-warning); --tone-soft: var(--tv-warning-soft); }
.tvcc .tn-green  { --tone: var(--tv-success); --tone-soft: var(--tv-success-soft); }
.tvcc .tn-purple { --tone: var(--tv-purple);  --tone-soft: var(--tv-purple-soft); }
.tvcc .tn-red    { --tone: var(--tv-danger);  --tone-soft: var(--tv-danger-soft); }
.tvcc .tn-slate  { --tone: var(--tv-slate);   --tone-soft: var(--tv-slate-soft); }

@keyframes tvccPulse {
    0%   { box-shadow: 0 0 0 0 rgba(51,189,119,.5); }
    70%  { box-shadow: 0 0 0 calc(var(--u) * 9) rgba(51,189,119,0); }
    100% { box-shadow: 0 0 0 0 rgba(51,189,119,0); }
}
@keyframes tvccFade {
    from { opacity: 0; transform: translateY(calc(var(--u) * 8)); }
    to   { opacity: 1; transform: none; }
}

/* ============================================================
   Topo
   ============================================================ */
.tvcc-top {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 22);
    padding: calc(var(--u) * 16) calc(var(--u) * 26);
    background: var(--tv-surface);
    border-bottom: 1px solid var(--tv-border);
}

.tvcc-brand {
    width: calc(var(--u) * 52);
    height: calc(var(--u) * 52);
    border-radius: calc(var(--u) * 14);
    background: var(--tv-grad);
    color: #fff;
    display: grid;
    place-items: center;
    flex: none;
    box-shadow: var(--tv-shadow);
}
.tvcc-brand .tvcc-ico { font-size: calc(var(--u) * 28); }

.tvcc-titlebox { min-width: 0; }
.tvcc-title {
    font-size: calc(var(--u) * 21);
    font-weight: 700;
    letter-spacing: -.4px;
    line-height: 1.15;
    white-space: nowrap;
}
.tvcc-sub {
    font-size: calc(var(--u) * 12.5);
    color: var(--tv-text-2);
    white-space: nowrap;
}
.tvcc-sub::first-letter { text-transform: uppercase; }

/* ---- abas Dia / Semana / Mês ---- */
.tvcc-tabs {
    display: flex;
    gap: calc(var(--u) * 4);
    padding: calc(var(--u) * 4);
    background: var(--tv-surface-2);
    border: 1px solid var(--tv-border);
    border-radius: 999px;
    margin-inline: auto;
}
.tvcc-tab {
    position: relative;
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 7);
    padding: calc(var(--u) * 9) calc(var(--u) * 20);
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--tv-text-2);
    font-family: inherit;
    font-size: calc(var(--u) * 13);
    font-weight: 600;
    cursor: pointer;
    overflow: hidden;
    transition: color .2s ease, background .2s ease;
    white-space: nowrap;
}
.tvcc-tab .tvcc-ico { font-size: calc(var(--u) * 17); }
.tvcc-tab:hover { color: var(--tv-text); }
.tvcc-tab.active {
    background: var(--tv-grad);
    color: #fff;
    box-shadow: var(--tv-shadow);
}
/* progresso da rotação automática, desenhado dentro da aba ativa */
.tvcc-tab-progress {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: calc(var(--u) * 3);
    background: rgba(255,255,255,.28);
    transform-origin: left;
    transition: width 1s linear;
}

/* ---- bloco da direita: ao vivo, relógio, ações ---- */
.tvcc-right {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 20);
    margin-left: auto;
}

.tvcc-live {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 9);
    padding: calc(var(--u) * 7) calc(var(--u) * 13);
    border: 1px solid var(--tv-border);
    border-radius: 999px;
    background: var(--tv-surface-2);
}
.tvcc-live-dot {
    width: calc(var(--u) * 10);
    height: calc(var(--u) * 10);
    border-radius: 50%;
    background: var(--tv-success);
    flex: none;
}
.tvcc-live.on .tvcc-live-dot { animation: tvccPulse 2s infinite; }
.tvcc-live.off .tvcc-live-dot { background: var(--tv-danger); }
.tvcc-live-t {
    font-size: calc(var(--u) * 10.5);
    font-weight: 700;
    letter-spacing: .8px;
    line-height: 1.2;
}
.tvcc-live.off .tvcc-live-t { color: var(--tv-danger); }
.tvcc-live-s {
    font-size: calc(var(--u) * 10);
    color: var(--tv-text-3);
    line-height: 1.2;
}

.tvcc-clockbox { text-align: right; }
.tvcc-clock {
    font-family: var(--mc-font-mono, 'IBM Plex Mono', monospace);
    font-size: calc(var(--u) * 30);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.5px;
    font-variant-numeric: tabular-nums;
}
.tvcc-clock-s {
    font-size: calc(var(--u) * 16);
    color: var(--tv-text-3);
    font-weight: 500;
}
.tvcc-date {
    font-size: calc(var(--u) * 11);
    color: var(--tv-text-2);
    margin-top: calc(var(--u) * 3);
    white-space: nowrap;
}
.tvcc-date::first-letter { text-transform: uppercase; }

.tvcc-actions { display: flex; gap: calc(var(--u) * 8); }
.tvcc-iconbtn {
    width: calc(var(--u) * 40);
    height: calc(var(--u) * 40);
    border-radius: calc(var(--u) * 11);
    border: 1px solid var(--tv-border);
    background: var(--tv-surface-2);
    color: var(--tv-text-2);
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: color .2s ease, border-color .2s ease, background .2s ease;
    padding: 0;
}
.tvcc-iconbtn .tvcc-ico { font-size: calc(var(--u) * 20); }
.tvcc-iconbtn:hover { color: var(--tv-brand); border-color: var(--tv-brand); }
.tvcc-iconbtn.active {
    background: var(--tv-brand-soft);
    border-color: var(--tv-brand);
    color: var(--tv-brand);
}

/* ============================================================
   KPIs
   ============================================================ */
.tvcc-kpis {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: calc(var(--u) * 14);
    padding: calc(var(--u) * 16) calc(var(--u) * 26) 0;
}
.tvcc-kpi {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 13);
    padding: calc(var(--u) * 13) calc(var(--u) * 17);
    background: var(--tv-surface);
    border: 1px solid var(--tv-border);
    border-radius: calc(var(--u) * 15);
}
.tvcc-kpi-icon {
    width: calc(var(--u) * 42);
    height: calc(var(--u) * 42);
    border-radius: calc(var(--u) * 12);
    background: var(--tone-soft, var(--tv-surface-2));
    color: var(--tone, var(--tv-text-2));
    display: grid;
    place-items: center;
    flex: none;
}
.tvcc-kpi-icon .tvcc-ico { font-size: calc(var(--u) * 23); }
.tvcc-kpi-value {
    font-size: calc(var(--u) * 30);
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.tvcc-kpi-label {
    font-size: calc(var(--u) * 11.5);
    font-weight: 600;
    letter-spacing: .7px;
    text-transform: uppercase;
    color: var(--tv-text-3);
    margin-top: calc(var(--u) * 4);
    white-space: nowrap;
}
.tvcc-kpi.live-on .tvcc-kpi-icon { animation: tvccPulse 2s infinite; }

/* ============================================================
   Corpo (área da vista ativa)
   ============================================================ */
.tvcc-body {
    padding: calc(var(--u) * 18) calc(var(--u) * 26) calc(var(--u) * 20);
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
    animation: tvccFade .35s var(--mc-ease, ease) both;
}
.tvcc-body::-webkit-scrollbar { width: calc(var(--u) * 8); }
.tvcc-body::-webkit-scrollbar-thumb { background: var(--tv-border-2); border-radius: 999px; }
.tvcc-body::-webkit-scrollbar-track { background: transparent; }

/* estado vazio / carregando */
.tvcc-empty {
    height: 100%;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: calc(var(--u) * 12);
    color: var(--tv-text-3);
    text-align: center;
}
.tvcc-empty .tvcc-ico { font-size: calc(var(--u) * 58); color: var(--tv-border-2); }
.tvcc-empty-t { font-size: calc(var(--u) * 17); font-weight: 600; color: var(--tv-text-2); }
.tvcc-empty-s { font-size: calc(var(--u) * 12.5); }

.tvcc-loading {
    position: fixed;
    inset: 0;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: calc(var(--u) * 16);
    background: var(--tv-bg);
    z-index: 60;
}
.tvcc-loading .tvcc-brand { animation: tvccPulse 1.6s infinite; }
.tvcc-loading-t { color: var(--tv-text-2); font-size: calc(var(--u) * 14); }

/* ============================================================
   Vista DIA — colunas por sala
   ============================================================ */
.tvcc-day {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(calc(var(--u) * 370), 1fr));
    gap: calc(var(--u) * 16);
    align-items: start;
}

.tvcc-room {
    background: var(--tv-surface);
    border: 1px solid var(--tv-border);
    border-radius: calc(var(--u) * 15);
    overflow: hidden;
}
.tvcc-room-head {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 10);
    padding: calc(var(--u) * 12) calc(var(--u) * 15);
    background: var(--tv-surface-2);
    border-bottom: 1px solid var(--tv-border);
}
.tvcc-room-head > .tvcc-ico { color: var(--tv-brand); font-size: calc(var(--u) * 20); }
.tvcc-room-name {
    font-size: calc(var(--u) * 16.5);
    font-weight: 700;
    line-height: 1.2;
}
.tvcc-room-bloco { font-size: calc(var(--u) * 12); color: var(--tv-text-3); line-height: 1.2; }
.tvcc-room-count {
    margin-left: auto;
    min-width: calc(var(--u) * 26);
    height: calc(var(--u) * 26);
    padding-inline: calc(var(--u) * 8);
    border-radius: 999px;
    background: var(--tv-brand-soft);
    color: var(--tv-brand);
    font-size: calc(var(--u) * 13.5);
    font-weight: 700;
    display: grid;
    place-items: center;
}
.tvcc-room-empty {
    padding: calc(var(--u) * 22) calc(var(--u) * 15);
    font-size: calc(var(--u) * 13.5);
    color: var(--tv-text-3);
    text-align: center;
}

/* cartão de cirurgia */
.tvcc-surg {
    position: relative;
    display: flex;
    gap: calc(var(--u) * 13);
    padding: calc(var(--u) * 12) calc(var(--u) * 15) calc(var(--u) * 12) calc(var(--u) * 18);
    border-top: 1px solid var(--tv-border);
}
.tvcc-surg:first-of-type { border-top: 0; }
/* tarja de acento: a cor resume o status */
.tvcc-surg::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: calc(var(--u) * 4);
    background: var(--tone, var(--tv-border-2));
}
.tvcc-surg.live { background: var(--tv-success-soft); }
.tvcc-surg.done { opacity: .55; }
.tvcc-surg.off  { opacity: .62; }
.tvcc-surg.off .tvcc-surg-pac { text-decoration: line-through; text-decoration-color: var(--tv-danger); }

.tvcc-surg-timebox { flex: none; text-align: center; min-width: calc(var(--u) * 58); }
.tvcc-surg-time {
    font-family: var(--mc-font-mono, 'IBM Plex Mono', monospace);
    font-size: calc(var(--u) * 19);
    font-weight: 600;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}
.tvcc-surg-dur { font-size: calc(var(--u) * 11.5); color: var(--tv-text-3); white-space: nowrap; }

.tvcc-surg-main { min-width: 0; flex: 1; }
.tvcc-surg-row {
    display: flex;
    align-items: baseline;
    gap: calc(var(--u) * 8);
    padding-right: calc(var(--u) * 98); /* espaço do pill de status */
}
.tvcc-surg-pac {
    font-size: calc(var(--u) * 17);
    font-weight: 700;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tvcc-surg-idade { font-size: calc(var(--u) * 12.5); color: var(--tv-text-3); flex: none; }
.tvcc-surg-urg {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--u) * 3);
    padding: calc(var(--u) * 2) calc(var(--u) * 8);
    border-radius: 999px;
    background: var(--tv-danger-soft);
    color: var(--tv-danger);
    font-size: calc(var(--u) * 11);
    font-weight: 700;
    letter-spacing: .5px;
    flex: none;
    align-self: center;
}
.tvcc-surg-urg .tvcc-ico { font-size: calc(var(--u) * 13.5); }
.tvcc-surg-proc {
    font-size: calc(var(--u) * 14);
    color: var(--tv-text-2);
    margin-top: calc(var(--u) * 2);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.tvcc-surg-meta {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--u) * 4) calc(var(--u) * 14);
    margin-top: calc(var(--u) * 6);
    font-size: calc(var(--u) * 12.5);
    color: var(--tv-text-3);
}
.tvcc-surg-meta span { display: inline-flex; align-items: center; gap: calc(var(--u) * 4); min-width: 0; }
.tvcc-surg-meta .tvcc-ico { font-size: calc(var(--u) * 15); }

.tvcc-pill {
    position: absolute;
    top: calc(var(--u) * 12);
    right: calc(var(--u) * 13);
    padding: calc(var(--u) * 3) calc(var(--u) * 10);
    border-radius: 999px;
    background: var(--tone-soft, var(--tv-surface-2));
    color: var(--tone, var(--tv-text-2));
    font-size: calc(var(--u) * 11);
    font-weight: 700;
    letter-spacing: .6px;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: calc(var(--u) * 5);
}
.tvcc-pill-dot {
    width: calc(var(--u) * 7);
    height: calc(var(--u) * 7);
    border-radius: 50%;
    background: var(--tone);
    animation: tvccPulse 2s infinite;
}

/* ============================================================
   Vista SEMANA
   ============================================================ */
.tvcc-week {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: calc(var(--u) * 12);
    align-items: stretch;
    min-height: 100%;
}
.tvcc-wday {
    display: flex;
    flex-direction: column;
    background: var(--tv-surface);
    border: 1px solid var(--tv-border);
    border-radius: calc(var(--u) * 15);
    overflow: hidden;
    min-width: 0;
}
.tvcc-wday-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: calc(var(--u) * 10) calc(var(--u) * 13);
    background: var(--tv-surface-2);
    border-bottom: 1px solid var(--tv-border);
}
.tvcc-wday.today .tvcc-wday-head { background: var(--tv-grad); }
.tvcc-wday.today .tvcc-wday-name,
.tvcc-wday.today .tvcc-wday-num { color: #fff; }
.tvcc-wday-name {
    font-size: calc(var(--u) * 12);
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--tv-text-2);
}
.tvcc-wday-num {
    font-size: calc(var(--u) * 19);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.tvcc-wday-list {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 7);
    padding: calc(var(--u) * 10);
    flex: 1;
}
.tvcc-wday-none {
    font-size: calc(var(--u) * 12);
    color: var(--tv-text-3);
    text-align: center;
    padding-block: calc(var(--u) * 16);
}

.tvcc-chip {
    position: relative;
    display: flex;
    gap: calc(var(--u) * 8);
    align-items: flex-start;
    padding: calc(var(--u) * 7) calc(var(--u) * 9) calc(var(--u) * 7) calc(var(--u) * 12);
    background: var(--tv-surface-2);
    border: 1px solid var(--tv-border);
    border-radius: calc(var(--u) * 9);
    overflow: hidden;
    min-width: 0;
}
.tvcc-chip::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: calc(var(--u) * 3.5);
    background: var(--tone, var(--tv-border-2));
}
.tvcc-chip.done { opacity: .55; }
.tvcc-chip.off  { opacity: .6; }
.tvcc-chip.off .tvcc-chip-n { text-decoration: line-through; text-decoration-color: var(--tv-danger); }
.tvcc-chip-h {
    font-family: var(--mc-font-mono, 'IBM Plex Mono', monospace);
    font-size: calc(var(--u) * 12.5);
    font-weight: 600;
    color: var(--tone, var(--tv-text-2));
    font-variant-numeric: tabular-nums;
    flex: none;
    line-height: 1.35;
}
.tvcc-chip-b { min-width: 0; }
.tvcc-chip-n {
    font-size: calc(var(--u) * 13.5);
    font-weight: 600;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tvcc-chip-p {
    font-size: calc(var(--u) * 11.5);
    color: var(--tv-text-3);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tvcc-more {
    font-size: calc(var(--u) * 12);
    font-weight: 600;
    color: var(--tv-brand);
    text-align: center;
    padding: calc(var(--u) * 4);
}
.tvcc-wday-total {
    padding: calc(var(--u) * 7) calc(var(--u) * 13);
    border-top: 1px solid var(--tv-border);
    font-size: calc(var(--u) * 12);
    color: var(--tv-text-3);
    text-align: center;
    background: var(--tv-surface-2);
    margin-top: auto;
}

/* ============================================================
   Vista MÊS
   ============================================================ */
.tvcc-month { display: flex; flex-direction: column; gap: calc(var(--u) * 8); min-height: 100%; }
.tvcc-month-head {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: calc(var(--u) * 10);
}
.tvcc-month-head span {
    font-size: calc(var(--u) * 12);
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--tv-text-3);
    text-align: center;
    padding-block: calc(var(--u) * 3);
}
.tvcc-month-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-auto-rows: 1fr;
    gap: calc(var(--u) * 10);
    flex: 1;
}
.tvcc-mday {
    background: var(--tv-surface);
    border: 1px solid var(--tv-border);
    border-radius: calc(var(--u) * 12);
    padding: calc(var(--u) * 8) calc(var(--u) * 10);
    min-height: calc(var(--u) * 104);
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 5);
}
.tvcc-mday.out { background: transparent; border-style: dashed; opacity: .45; }
.tvcc-mday.today {
    border-color: var(--tv-brand);
    box-shadow: inset 0 0 0 1px var(--tv-brand);
    background: var(--tv-brand-soft);
}
.tvcc-mday-top { display: flex; align-items: center; justify-content: space-between; }
.tvcc-mday-num {
    font-size: calc(var(--u) * 15);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.tvcc-mday.today .tvcc-mday-num { color: var(--tv-brand); }
.tvcc-mday-count {
    min-width: calc(var(--u) * 20);
    height: calc(var(--u) * 20);
    padding-inline: calc(var(--u) * 6);
    border-radius: 999px;
    background: var(--tv-brand-soft);
    color: var(--tv-brand);
    font-size: calc(var(--u) * 11.5);
    font-weight: 700;
    display: grid;
    place-items: center;
}
.tvcc-mday.today .tvcc-mday-count { background: var(--tv-brand); color: var(--tv-brand-ink); }
.tvcc-mchip {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 5);
    font-size: calc(var(--u) * 11.5);
    line-height: 1.3;
    min-width: 0;
    color: var(--tv-text-2);
}
.tvcc-mchip::before {
    content: '';
    width: calc(var(--u) * 7);
    height: calc(var(--u) * 7);
    border-radius: 50%;
    background: var(--tone, var(--tv-border-2));
    flex: none;
}
.tvcc-mchip b {
    font-family: var(--mc-font-mono, 'IBM Plex Mono', monospace);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--tv-text);
    flex: none;
}
.tvcc-mchip i {
    font-style: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tvcc-mchip.off i { text-decoration: line-through; text-decoration-color: var(--tv-danger); }
.tvcc-mday .tvcc-more { text-align: left; padding: 0; font-size: calc(var(--u) * 11); }

/* ============================================================
   Rodapé — legenda + sincronização
   ============================================================ */
.tvcc-foot {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 22);
    padding: calc(var(--u) * 11) calc(var(--u) * 26);
    background: var(--tv-surface);
    border-top: 1px solid var(--tv-border);
}
.tvcc-legend {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--u) * 6) calc(var(--u) * 18);
}
.tvcc-legend span {
    display: inline-flex;
    align-items: center;
    gap: calc(var(--u) * 6);
    font-size: calc(var(--u) * 12.5);
    color: var(--tv-text-2);
    white-space: nowrap;
}
.tvcc-legend span::before {
    content: '';
    width: calc(var(--u) * 9);
    height: calc(var(--u) * 9);
    border-radius: 50%;
    background: var(--tone, var(--tv-border-2));
}
.tvcc-foot-sync {
    margin-left: auto;
    font-size: calc(var(--u) * 10.5);
    color: var(--tv-text-3);
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: calc(var(--u) * 6);
}
.tvcc-foot-sync .tvcc-ico { font-size: calc(var(--u) * 14); }

/* ============================================================
   Modal de detalhe — clique num cartão (Hoje) ou num dia
   (Semana/Mês) abre as informações em tamanho maior
   ============================================================ */
.tvcc .tvcc-surg { cursor: pointer; }
.tvcc .tvcc-wday.clicavel, .tvcc .tvcc-mday.clicavel { cursor: pointer; }
.tvcc .tvcc-surg:hover, .tvcc .tvcc-wday.clicavel:hover, .tvcc .tvcc-mday.clicavel:hover { filter: brightness(1.07); }

.tvcc-modal-back {
    position: fixed; inset: 0; z-index: 50;
    background: rgba(2, 12, 18, .72);
    backdrop-filter: blur(3px);
    display: flex; align-items: center; justify-content: center;
    padding: calc(var(--u) * 40);
}
.tvcc-modal {
    width: min(calc(var(--u) * 980), 94vw);
    max-height: 88vh;
    display: flex; flex-direction: column;
    background: var(--tv-surface);
    border: 1px solid var(--tv-border-2);
    border-radius: calc(var(--u) * 18);
    box-shadow: 0 calc(var(--u) * 24) calc(var(--u) * 80) rgba(0, 0, 0, .5);
    overflow: hidden;
    animation: tvccModalIn .18s ease-out;
}
@keyframes tvccModalIn { from { opacity: 0; transform: translateY(calc(var(--u) * 14)) scale(.98); } }
.tvcc-modal-head {
    display: flex; align-items: center; justify-content: space-between;
    gap: calc(var(--u) * 14);
    padding: calc(var(--u) * 16) calc(var(--u) * 22);
    background: var(--tv-surface-2);
    border-bottom: 1px solid var(--tv-border);
}
/* capitalize por palavra deixava "28 De Julho" — só a primeira letra sobe */
.tvcc-modal-title { font-size: calc(var(--u) * 22); font-weight: 800; }
.tvcc-modal-title::first-letter { text-transform: uppercase; }
.tvcc-modal-sub { font-size: calc(var(--u) * 13); color: var(--tv-text-3); }
.tvcc-modal-body {
    padding: calc(var(--u) * 18) calc(var(--u) * 22);
    display: flex; flex-direction: column; gap: calc(var(--u) * 14);
    overflow-y: auto;
}
.tvcc-modal-empty { text-align: center; color: var(--tv-text-3); font-size: calc(var(--u) * 15); padding: calc(var(--u) * 30); }

/* cartão ampliado (~1.4x o cartão da vista Hoje) */
.tvcc-msurg {
    position: relative;
    display: flex; gap: calc(var(--u) * 18);
    padding: calc(var(--u) * 16) calc(var(--u) * 20) calc(var(--u) * 16) calc(var(--u) * 26);
    background: var(--tv-surface-2);
    border: 1px solid var(--tv-border);
    border-radius: calc(var(--u) * 14);
    overflow: hidden;
}
.tvcc-msurg::before {
    content: '';
    position: absolute; left: 0; top: 0; bottom: 0;
    width: calc(var(--u) * 6);
    background: var(--tone, var(--tv-border-2));
}
.tvcc-msurg.live { background: var(--tv-success-soft); }
.tvcc-msurg.done { opacity: .6; }
.tvcc-msurg.off  { opacity: .65; }
.tvcc-msurg.off .tvcc-msurg-pac { text-decoration: line-through; text-decoration-color: var(--tv-danger); }
.tvcc-msurg-time { flex: none; text-align: center; min-width: calc(var(--u) * 88); }
.tvcc-msurg-h {
    font-family: var(--mc-font-mono, 'IBM Plex Mono', monospace);
    font-size: calc(var(--u) * 30); font-weight: 700; line-height: 1.05;
    font-variant-numeric: tabular-nums;
}
.tvcc-msurg-d { font-size: calc(var(--u) * 14); color: var(--tv-text-3); }
.tvcc-msurg-main { min-width: 0; flex: 1; }
.tvcc-msurg-row { display: flex; align-items: baseline; gap: calc(var(--u) * 12); flex-wrap: wrap; }
.tvcc-msurg-pac { font-size: calc(var(--u) * 24); font-weight: 800; line-height: 1.2; }
.tvcc-msurg-idade { font-size: calc(var(--u) * 15); color: var(--tv-text-3); }
.tvcc-mpill {
    margin-left: auto; align-self: center;
    padding: calc(var(--u) * 5) calc(var(--u) * 14);
    border-radius: 999px;
    background: var(--tone-soft, var(--tv-surface-2));
    color: var(--tone, var(--tv-text-2));
    font-size: calc(var(--u) * 13); font-weight: 800; letter-spacing: .6px;
    white-space: nowrap;
    display: inline-flex; align-items: center; gap: calc(var(--u) * 6);
}
.tvcc-msurg-proc { font-size: calc(var(--u) * 17); color: var(--tv-text-2); margin-top: calc(var(--u) * 6); line-height: 1.35; }
.tvcc-msurg-meta {
    display: flex; flex-wrap: wrap;
    gap: calc(var(--u) * 6) calc(var(--u) * 22);
    margin-top: calc(var(--u) * 10);
    font-size: calc(var(--u) * 15); color: var(--tv-text-3);
}
.tvcc-msurg-meta span { display: inline-flex; align-items: center; gap: calc(var(--u) * 6); }
.tvcc-msurg-meta .tvcc-ico { font-size: calc(var(--u) * 18); }
