/* =========================================================
   Cactus theme — identidade visual do Cactus Fitness
   (fundo escuro, verde-limão, Space Grotesk + Plus Jakarta Sans)
   ========================================================= */
:root {
  --bg: hsl(0 0% 4%);
  --bg-elevated: hsl(0 0% 6%);
  --surface-1: hsl(0 0% 8%);
  --surface-2: hsl(0 0% 10%);
  --surface-3: hsl(0 0% 13%);
  --surface-4: hsl(0 0% 16%);
  --surface-hover: hsl(0 0% 19%);
  --fg: hsl(0 0% 96%);
  --fg-secondary: hsl(0 0% 63%);
  --fg-muted: hsl(0 0% 40%);
  --fg-dim: hsl(0 0% 27%);
  --border: rgba(255,255,255,0.06);
  --border-strong: rgba(255,255,255,0.12);
  --primary: hsl(67 96% 48%);
  --primary-rgb: 215,242,5;
  --primary-fg: #000;
  --primary-10: rgba(215,242,5,0.10);
  --primary-15: rgba(215,242,5,0.15);
  --primary-20: rgba(215,242,5,0.20);
  --primary-40: rgba(215,242,5,0.40);
  --glow: 0 0 20px rgba(215,242,5,0.15);
  --glow-lg: 0 0 40px rgba(215,242,5,0.30);
  --destructive: hsl(0 84% 60%);
  --success: hsl(153 76% 48%);
  --warning: hsl(38 96% 56%);
  --dialog-overlay: oklch(0 0 0 / .6);
  --dialog-shadow: 0 10px 15px -3px oklch(0 0 0 / .1), 0 4px 6px -4px oklch(0 0 0 / .1);
  --status-fg: oklch(1 0 0);
  --font-body: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --font-display: "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
  --radius: 12px;
  --rail: 72px;
}

*, *::before, *::after { box-sizing: border-box; }
.cx a { text-decoration: none; }
.cx a:hover { text-decoration: none; }
html, body { background: var(--bg) !important; color: var(--fg); }
body.cx {
  font-family: var(--font-body) !important;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  background-image:
    radial-gradient(ellipse at top right, rgba(215,242,5,0.15) 0%, transparent 60%),
    radial-gradient(ellipse at bottom left, rgba(215,242,5,0.06) 0%, transparent 55%) !important;
  background-attachment: fixed !important;
  font-size: 14px;
}
.cx h1, .cx h2, .cx h3, .cx h4, .cx h5, .cx h6, .font-display { font-family: var(--font-display) !important; color: var(--fg); letter-spacing: -0.01em; }
.cx a { color: var(--primary); }
.cx a:hover { color: var(--primary); }
.cx .text-muted, .cx .text-secondary { color: var(--fg-secondary) !important; }
.cx-muted { color: var(--fg-secondary); }
.cx-dim { color: var(--fg-muted); }
.cx-primary { color: var(--primary) !important; }
.cx-icon { flex-shrink: 0; vertical-align: middle; }
* { scrollbar-width: none; }
*::-webkit-scrollbar { width: 0; height: 0; }

/* ---------- Shell: menu lateral fixo só com ícones ---------- */
.cx-rail {
  position: fixed; inset: 0 auto 0 0; z-index: 1040; width: var(--rail);
  display: none; flex-direction: column; align-items: center; gap: 8px;
  padding: 16px 0; background: var(--bg); border-right: 1px solid var(--border);
}
@media (min-width: 768px) { .cx-rail { display: flex; } }
.cx-rail-logo { width: 40px; height: 40px; display: grid; place-items: center; margin-bottom: 8px; }
.cx-logo-mask {
  display: block; width: 32px; height: 32px; background: var(--primary);
  -webkit-mask: url(logo-256.png) center / contain no-repeat; mask: url(logo-256.png) center / contain no-repeat;
}
.cx-rail-btn {
  position: relative; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px;
  color: rgba(245,245,245,.7) !important; transition: background .15s, color .15s; text-decoration: none !important;
  background: transparent; border: 0; cursor: pointer;
}
.cx-rail-btn:hover { background: rgba(255,255,255,.05); color: var(--fg) !important; }
.cx-rail-btn.active { background: var(--primary-20); color: var(--primary) !important; }
.cx-rail-btn.active::before { content: ""; position: absolute; left: -14px; top: 50%; width: 4px; height: 28px; transform: translateY(-50%); border-radius: 0 9999px 9999px 0; background: var(--primary); }
.cx-rail-btn .cx-tip {
  pointer-events: none; position: absolute; left: 100%; margin-left: 12px; z-index: 60; white-space: nowrap;
  border-radius: 6px; background: var(--surface-2); padding: 4px 8px; font-size: 12px; font-weight: 500; color: var(--fg);
  box-shadow: 0 4px 12px rgba(0,0,0,.5); border: 1px solid var(--border); opacity: 0; transition: opacity .15s;
}
.cx-rail-btn:hover .cx-tip { opacity: 1; }
.cx-rail-bottom { margin-top: auto; display: flex; flex-direction: column; align-items: center; gap: 8px; position: relative; }
.cx-avatar-btn { width: 40px; height: 40px; border-radius: 9999px; display: grid; place-items: center; font-family: var(--font-display); font-weight: 700; font-size: 14px; border: 0; cursor: pointer; overflow: hidden; box-shadow: 0 0 0 2px var(--primary-40); }
.cx-avatar-btn img { width: 100%; height: 100%; object-fit: cover; }
.cx-menu {
  position: absolute; z-index: 1060; min-width: 220px; padding: 6px; border-radius: 12px;
  background: var(--surface-2); border: 1px solid var(--border-strong); box-shadow: 0 8px 30px rgba(0,0,0,.6); display: none;
}
.cx-menu.open { display: block; }
.cx-rail .cx-menu { left: calc(100% + 12px); bottom: 0; }
.cx-menu-head { padding: 8px 10px 10px; border-bottom: 1px solid var(--border); margin-bottom: 4px; }
.cx-menu-head strong { display: block; font-size: 13px; color: var(--fg); }
.cx-menu-head span { font-size: 11px; color: var(--fg-secondary); }
.cx-menu a, .cx-menu button.cx-menu-item {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border-radius: 8px; font-size: 13px;
  color: var(--fg) !important; text-decoration: none !important; background: transparent; border: 0; text-align: left; cursor: pointer;
}
.cx-menu a:hover, .cx-menu button.cx-menu-item:hover { background: var(--surface-3); }
.cx-menu .danger { color: var(--destructive) !important; }

.cx-main { min-height: 100vh; padding-bottom: 96px; }
@media (min-width: 768px) { .cx-main { margin-left: var(--rail); padding-bottom: 32px; } }
.cx-container { max-width: 1180px; margin: 0 auto; padding: 16px; }
.cx-container.narrow { max-width: 896px; }
@media (min-width: 768px) { .cx-container { padding: 32px 24px; } }

/* topo do celular */
.cx-mtop { position: sticky; top: 0; z-index: 1030; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--border); background: rgba(10,10,10,.8); backdrop-filter: blur(10px); }
.cx-mtop .brand { display: flex; align-items: center; gap: 8px; min-width: 0; font-family: var(--font-display); font-weight: 600; font-size: 16px; color: var(--fg); }
.cx-mtop .brand .cx-logo-mask { width: 28px; height: 28px; }
.cx-mtop .cx-menu { right: 0; top: calc(100% + 8px); }
@media (min-width: 768px) { .cx-mtop { display: none; } }

/* barra inferior do celular */
.cx-bnav { position: fixed; inset: auto 0 0 0; z-index: 1035; display: flex; justify-content: space-around; align-items: stretch; padding: 8px 6px calc(8px + env(safe-area-inset-bottom)); border-top: 1px solid var(--border); background: rgba(10,10,10,.95); backdrop-filter: blur(10px); }
.cx-bnav a { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 4px 0; font-size: 10px; color: var(--fg-secondary) !important; text-decoration: none !important; }
.cx-bnav a.active { color: var(--primary) !important; }
.cx-bnav a span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (min-width: 768px) { .cx-bnav { display: none; } }

/* ---------- Cabeçalho de página ---------- */
.cx-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .15em; color: var(--primary); }
.cx-title { margin: 4px 0 0; font-family: var(--font-display); font-size: 24px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.15; }
@media (min-width: 768px) { .cx-title { font-size: 30px; } }
.cx-sub { margin-top: 4px; font-size: 12px; color: var(--fg-secondary); }
.cx-pagehead { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }
@media (min-width: 768px) { .cx-pagehead { flex-direction: row; align-items: flex-end; justify-content: space-between; } }
.cx-stickybar { position: sticky; top: 0; z-index: 1020; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px; border-bottom: 1px solid var(--border); background: rgba(10,10,10,.92); backdrop-filter: blur(12px); }
@media (min-width: 768px) { .cx-stickybar { padding: 20px 24px; } }
.cx-stickybar h1 { margin: 0; font-size: 22px; font-weight: 700; }
.cx-back { display: inline-flex; align-items: center; gap: 4px; padding: 4px 8px; border-radius: 9999px; font-size: 14px; color: var(--fg-secondary) !important; text-decoration: none !important; }
.cx-back:hover { background: var(--surface-3); color: var(--fg) !important; }

/* ---------- Botões ---------- */
.cx-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap; border-radius: 9999px; padding: 8px 16px; font-size: 12px; font-weight: 600; line-height: 1.2; border: 1px solid transparent; cursor: pointer; transition: all .2s ease; text-decoration: none !important; font-family: var(--font-body); }
.cx-btn:active { transform: scale(.97); }
.cx-btn-primary { background: var(--primary); color: var(--primary-fg) !important; box-shadow: var(--glow); font-weight: 700; }
.cx-btn-primary:hover { box-shadow: var(--glow-lg); transform: translateY(-2px); filter: brightness(1.05); }
.cx-btn-outline { background: var(--surface-1); border-color: var(--border); color: var(--fg) !important; }
.cx-btn-outline:hover { border-color: var(--primary-40); color: var(--primary) !important; }
.cx-btn-ghost { background: transparent; color: var(--fg-secondary) !important; }
.cx-btn-ghost:hover { background: var(--surface-3); color: var(--fg) !important; }
.cx-btn-danger { background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.3); color: var(--destructive) !important; }
.cx-btn-danger:hover { background: rgba(239,68,68,.2); }
.cx-btn-lg { height: 48px; padding: 0 32px; font-size: 14px; }
.cx-btn-block { width: 100%; }
.cx-icon-btn { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 9999px; color: var(--fg-secondary) !important; background: transparent; border: 0; cursor: pointer; text-decoration: none !important; }
.cx-icon-btn:hover { background: var(--surface-3); color: var(--fg) !important; }
.cx-icon-btn.danger:hover { background: rgba(239,68,68,.12); color: var(--destructive) !important; }

/* ---------- Cartões ---------- */
.cx-card { border-radius: var(--radius); border: 1px solid var(--border); background: var(--surface-1); }
.cx-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--border); }
.cx-card-head h2 { margin: 0; font-size: 16px; font-weight: 700; }
.cx-card-head p { margin: 0; font-size: 11px; color: var(--fg-secondary); }
.cx-card-body { padding: 16px; }
.cx-grid { display: grid; gap: 12px; }
.cx-grid-3 { grid-template-columns: 1fr; }
@media (min-width: 640px) { .cx-grid-3 { grid-template-columns: repeat(3, 1fr); } .cx-grid-2 { grid-template-columns: repeat(2, 1fr); } }
.cx-grid-main { grid-template-columns: 1fr; }
@media (min-width: 1024px) { .cx-grid-main { grid-template-columns: 1.4fr 1fr; } }

.cx-kpi { padding: 16px; }
.cx-kpi-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .15em; color: var(--fg-secondary); }
.cx-kpi-row { margin-top: 12px; display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.cx-kpi-value { font-family: var(--font-display); font-size: 30px; font-weight: 800; line-height: 1; letter-spacing: -0.02em; }
.cx-kpi-hint { margin-top: 8px; font-size: 11px; color: var(--fg-secondary); }
.cx-delta { display: inline-flex; align-items: center; gap: 4px; border-radius: 9999px; background: rgba(16,185,129,.15); padding: 2px 8px; font-size: 10px; font-weight: 700; color: #34d399; }
.cx-spark { width: 96px; height: 32px; color: var(--primary); }

.cx-tile { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 8px; border: 1px solid var(--border); background: rgba(10,10,10,.4); color: var(--fg) !important; text-decoration: none !important; transition: border-color .15s; }
.cx-tile:hover { border-color: var(--primary-40); }
.cx-tile-icon { width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center; border-radius: 6px; background: var(--primary-15); color: var(--primary); }
.cx-tile-title { font-size: 14px; font-weight: 600; }
.cx-tile-desc { font-size: 11px; color: var(--fg-secondary); }
.cx-truncate { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.cx-action { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-radius: var(--radius); border: 1px solid var(--border); background: var(--surface-1); color: var(--fg) !important; text-decoration: none !important; transition: all .15s; width: 100%; }
.cx-action:hover { border-color: var(--primary-40); }
.cx-action-icon { width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center; border-radius: 9999px; background: var(--primary-15); color: var(--primary); }

/* lista */
.cx-list { list-style: none; margin: 0; padding: 0; }
.cx-list > li, .cx-list > a { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--border); color: var(--fg) !important; text-decoration: none !important; transition: background .15s; }
.cx-list > li:first-child, .cx-list > a:first-child { border-top: 0; }
.cx-list > a:hover { background: var(--surface-2); }
.cx-av { width: 40px; height: 40px; flex-shrink: 0; display: grid; place-items: center; border-radius: 9999px; font-family: var(--font-display); font-weight: 700; font-size: 15px; overflow: hidden; }
.cx-av img { width: 100%; height: 100%; object-fit: cover; }
.cx-av-sm { width: 32px; height: 32px; font-size: 12px; }
.cx-av-lg { width: 64px; height: 64px; font-size: 18px; box-shadow: 0 0 0 2px var(--primary), 0 4px 12px rgba(0,0,0,.5); }
.cx-bar { margin-top: 4px; height: 6px; width: 100%; overflow: hidden; border-radius: 9999px; background: var(--surface-3); }
.cx-bar > div { height: 100%; border-radius: 9999px; background: var(--primary); }

/* etiquetas */
.cx-pill { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; border-radius: 9999px; padding: 4px 10px; font-size: 12px; font-weight: 500; }
.cx-pill-active { background: rgba(20,83,45,.2); color: #22c55e; }
.cx-pill-primary { background: var(--primary-15); color: var(--primary); }
.cx-pill-muted { background: var(--surface-3); color: var(--fg-secondary); }
.cx-pill-danger { background: rgba(239,68,68,.12); color: var(--destructive); }
.cx-chip { display: inline-flex; align-items: center; border-radius: 9999px; padding: 2px 8px; font-size: 10px; font-weight: 700; background: var(--surface-3); color: var(--fg-secondary); }

/* busca + abas */
.cx-search { position: relative; flex: 1; }
.cx-search .cx-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--fg-muted); pointer-events: none; }
.cx-search input { width: 100%; height: 48px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface-2); padding: 0 40px; font-size: 14px; color: var(--fg); outline: none; transition: border-color .15s; }
.cx-search input::placeholder { color: var(--fg-muted); }
.cx-search input:focus { border-color: var(--primary); }
.cx-segment { display: inline-flex; align-items: center; min-width: 0; overflow-x: auto; border-radius: 9999px; background: var(--surface-2); padding: 4px; }
.cx-segment a { flex-shrink: 0; white-space: nowrap; border-radius: 9999px; padding: 6px 12px; font-size: 12px; font-weight: 500; color: var(--fg-secondary) !important; text-decoration: none !important; }
.cx-segment a:hover { color: var(--fg) !important; }
.cx-segment a.active { background: var(--primary); color: var(--primary-fg) !important; }
.cx-sort { display: inline-flex; align-items: center; gap: 6px; height: 36px; border-radius: 9999px; border: 1px solid var(--border); background: var(--surface-2); padding: 0 12px; font-size: 12px; color: var(--fg) !important; text-decoration: none !important; white-space: nowrap; }
.cx-tabs { display: flex; overflow-x: auto; border-bottom: 1px solid var(--border); }
.cx-tabs button, .cx-tabs a { white-space: nowrap; padding: 12px 16px; font-size: 14px; font-weight: 500; color: var(--fg-secondary) !important; background: none; border: 0; border-bottom: 2px solid transparent; cursor: pointer; text-decoration: none !important; }
.cx-tabs .active { color: var(--primary) !important; border-bottom-color: var(--primary); }
.cx-section-label { font-family: var(--font-display); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--fg-muted); margin: 0; }
.cx-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 48px 24px; text-align: center; border: 1px dashed var(--border-strong); border-radius: 8px; }
.cx-empty-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 16px; background: var(--surface-3); color: var(--primary); }
.cx-dl { display: grid; gap: 12px; }
.cx-dl div { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 10px; border: 1px solid var(--border); background: rgba(10,10,10,.4); }
.cx-dl dt { font-size: 11px; font-weight: 500; color: var(--fg-secondary); margin: 0; }
.cx-dl dd { margin: 0; font-size: 14px; font-weight: 500; color: var(--fg); }

/* formulários próprios */
.cx-input, .cx select.form-control, .cx .form-control, .cx .custom-select {
  height: 48px; width: 100%; border-radius: 10px !important; border: 1px solid var(--border) !important; background: var(--surface-2) !important;
  color: var(--fg) !important; padding: 0 16px; font-size: 14px; outline: none; transition: border-color .2s, box-shadow .2s; box-shadow: none !important;
}
.cx textarea.form-control { height: auto; min-height: 96px; padding: 12px 16px; }
.cx-input:hover, .cx .form-control:hover { border-color: var(--border-strong) !important; }
.cx-input:focus, .cx .form-control:focus, .cx .custom-select:focus { border-color: var(--primary) !important; box-shadow: 0 0 0 3px rgba(215,242,5,.15) !important; }
.cx .form-control::placeholder, .cx-input::placeholder { color: var(--fg-muted) !important; }
.cx .form-control:disabled, .cx .form-control[readonly] { opacity: .7; }
.cx label, .cx .col-form-label { color: var(--fg-secondary); font-size: 12px; font-weight: 500; margin-bottom: 6px; }
.cx select.form-control option { background: var(--surface-2); color: var(--fg); }
.cx .input-group-text { background: var(--surface-3) !important; border-color: var(--border) !important; color: var(--fg-secondary) !important; }
.cx .custom-file-label { background: var(--surface-2) !important; border-color: var(--border) !important; color: var(--fg-secondary) !important; height: 48px; line-height: 34px; border-radius: 10px; }
.cx .custom-file-label::after { height: 46px; line-height: 34px; background: var(--surface-3); color: var(--fg); }
.cx .invalid-feedback, .cx .text-danger { color: var(--destructive) !important; }
.cx .is-invalid { border-color: var(--destructive) !important; }

/* alertas */
.cx-alert { display: flex; align-items: flex-start; gap: 8px; border-radius: 10px; padding: 10px 12px; font-size: 13px; margin-bottom: 16px; }
.cx-alert-success { border: 1px solid var(--primary-40); background: var(--primary-10); color: var(--primary); }
.cx-alert-error { border: 1px solid rgba(239,68,68,.3); background: rgba(239,68,68,.1); color: var(--destructive); }
.cx-alert ul { margin: 0; padding-left: 16px; }
.cx-alert strong { color: inherit; }

/* =========================================================
   Bootstrap (telas antigas) no tema Cactus
   ========================================================= */
.cx .card { background: var(--surface-1) !important; border: 1px solid var(--border) !important; border-radius: var(--radius) !important; box-shadow: none !important; color: var(--fg); margin-bottom: 16px; }
.cx .card-header, .cx .card-footer { background: transparent !important; border-color: var(--border) !important; }
.cx .card-title, .cx .card-body h4 { font-family: var(--font-display); color: var(--fg); font-weight: 700; }
.cx .btn { border-radius: 9999px !important; font-weight: 600; font-size: 13px; padding: 8px 18px; box-shadow: none !important; font-family: var(--font-body); }
.cx .btn-sm { padding: 5px 12px; font-size: 12px; }
.cx .btn-primary, .cx .btn-success, .cx .btn-info, .cx .btn-dark { background: var(--primary) !important; border-color: var(--primary) !important; color: #000 !important; }
.cx .btn-primary:hover, .cx .btn-success:hover, .cx .btn-info:hover, .cx .btn-dark:hover { filter: brightness(1.08); box-shadow: var(--glow) !important; }
.cx .btn-light, .cx .btn-secondary, .cx .btn-outline-secondary, .cx .btn-outline-dark, .cx .btn-outline-primary, .cx .btn-outline-light { background: var(--surface-2) !important; border: 1px solid var(--border) !important; color: var(--fg) !important; }
.cx .btn-light:hover, .cx .btn-secondary:hover, .cx .btn-outline-secondary:hover, .cx .btn-outline-primary:hover { border-color: var(--primary-40) !important; color: var(--primary) !important; }
.cx .btn-danger, .cx .btn-outline-danger { background: rgba(239,68,68,.12) !important; border: 1px solid rgba(239,68,68,.3) !important; color: var(--destructive) !important; }
.cx .btn-warning { background: rgba(251,191,36,.15) !important; border: 1px solid rgba(251,191,36,.3) !important; color: var(--warning) !important; }
.cx .btn-link { color: var(--primary) !important; }
.cx .table { color: var(--fg) !important; margin-bottom: 0; }
.cx .table th, .cx .table td { border-color: var(--border) !important; vertical-align: middle; }
.cx .table thead th, .cx .thead-light th, .cx .table-light th { background: transparent !important; color: var(--fg-secondary) !important; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; font-weight: 600; border-bottom: 1px solid var(--border) !important; }
.cx .table-hover tbody tr:hover, .cx .table-striped tbody tr:nth-of-type(odd) { background: var(--surface-2) !important; color: var(--fg); }
.cx .table-bordered, .cx .table-bordered td, .cx .table-bordered th { border-color: var(--border) !important; }
.cx .modal-content { background: var(--surface-1) !important; border: 1px solid var(--border-strong) !important; border-radius: 16px !important; color: var(--fg); }
.cx .modal-header, .cx .modal-footer { border-color: var(--border) !important; }
.cx .modal-title { font-family: var(--font-display); font-weight: 700; color: var(--fg); }
.cx .close { color: var(--fg) !important; text-shadow: none; opacity: .6; }
.cx .modal-backdrop.show { opacity: .7; }
.cx .dropdown-menu { background: var(--surface-2) !important; border: 1px solid var(--border-strong) !important; border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,.6); }
.cx .dropdown-item { color: var(--fg) !important; border-radius: 8px; }
.cx .dropdown-item:hover { background: var(--surface-3) !important; }
.cx .alert { border-radius: 10px !important; border: 1px solid var(--border) !important; }
.cx .alert-success { background: var(--primary-10) !important; border-color: var(--primary-40) !important; color: var(--primary) !important; }
.cx .alert-danger { background: rgba(239,68,68,.1) !important; border-color: rgba(239,68,68,.3) !important; color: var(--destructive) !important; }
.cx .alert-warning, .cx .alert-info { background: var(--surface-2) !important; color: var(--fg) !important; }
.cx .badge { border-radius: 9999px; padding: 4px 10px; font-weight: 500; }
.cx .badge-success, .cx .badge-soft-success { background: rgba(20,83,45,.25) !important; color: #22c55e !important; }
.cx .badge-danger, .cx .badge-soft-danger { background: rgba(239,68,68,.12) !important; color: var(--destructive) !important; }
.cx .badge-primary, .cx .badge-info, .cx .badge-soft-primary { background: var(--primary-15) !important; color: var(--primary) !important; }
.cx .badge-secondary, .cx .badge-light, .cx .badge-dark { background: var(--surface-3) !important; color: var(--fg-secondary) !important; }
.cx .pagination { gap: 4px; flex-wrap: wrap; }
.cx .page-link { background: var(--surface-2) !important; border: 1px solid var(--border) !important; color: var(--fg-secondary) !important; border-radius: 9999px !important; min-width: 36px; text-align: center; }
.cx .page-item.active .page-link { background: var(--primary) !important; border-color: var(--primary) !important; color: #000 !important; }
.cx .page-item.disabled .page-link { opacity: .4; }
.cx .nav-tabs, .cx .nav-tabs-custom { border-color: var(--border) !important; }
.cx .nav-tabs .nav-link { color: var(--fg-secondary) !important; border: 0 !important; border-bottom: 2px solid transparent !important; background: transparent !important; }
.cx .nav-tabs .nav-link.active { color: var(--primary) !important; border-bottom-color: var(--primary) !important; }
.cx .nav-pills .nav-link { border-radius: 9999px; color: var(--fg-secondary) !important; }
.cx .nav-pills .nav-link.active { background: var(--primary) !important; color: #000 !important; }
.cx .alert-success.rounded-lg, .cx .alert-danger.rounded-lg { display: inline-block; border-radius: 9999px !important; padding: 3px 10px !important; margin: 0; font-size: 12px; }
.cx .bg-light, .cx .bg-white, .cx .bg-soft-light { background: var(--surface-2) !important; }
.cx .bg-dark { background: var(--surface-1) !important; }
.cx .text-dark, .cx .text-body { color: var(--fg) !important; }
.cx .text-primary, .cx .text-info, .cx .text-success { color: var(--primary) !important; }
.cx .border, .cx .border-top, .cx .border-bottom, .cx hr { border-color: var(--border) !important; }
.cx .list-group-item { background: transparent; border-color: var(--border); color: var(--fg); }
.cx .custom-control-label::before { background: var(--surface-3); border-color: var(--border-strong); }
.cx .custom-control-input:checked ~ .custom-control-label::before { background: var(--primary); border-color: var(--primary); }
.cx .page-title-box, .cx .breadcrumb { display: none !important; }
.cx .select2-container--default .select2-selection--single, .cx .select2-container--default .select2-selection--multiple { background: var(--surface-2) !important; border-color: var(--border) !important; min-height: 48px; border-radius: 10px; }
.cx .select2-dropdown { background: var(--surface-2) !important; border-color: var(--border-strong) !important; color: var(--fg); }
.cx .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--fg) !important; line-height: 46px; }
.cx .toast-success { background-color: #1a1f05 !important; color: var(--primary) !important; }

/* ---------- Login ---------- */
.cx-auth { min-height: 100vh; display: flex; flex-direction: column; background: var(--bg); }
@media (min-width: 1024px) { .cx-auth { flex-direction: row; } }
.cx-auth-hero { display: none; position: relative; overflow: hidden; }
@media (min-width: 1024px) { .cx-auth-hero { display: flex; width: 50%; } }
@media (min-width: 1280px) { .cx-auth-hero { width: 55%; } }
.cx-auth-bg { position: absolute; inset: 0; background: url(gym-bg.jpg) center / cover; filter: brightness(.5) contrast(1.1); }
.cx-auth-fade { position: absolute; inset: 0; background: linear-gradient(to top, var(--bg), rgba(10,10,10,.7), transparent); }
.cx-auth-hero-inner { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; height: 100%; width: 100%; padding: 32px; }
@media (min-width: 1280px) { .cx-auth-hero-inner { padding: 48px; } }
.cx-auth-logo { position: relative; width: fit-content; }
.cx-auth-logo::before { content: ""; position: absolute; inset: -16px; border-radius: 9999px; background: radial-gradient(ellipse at center, rgba(215,242,5,.12) 0%, transparent 70%); }
.cx-auth-logo img { position: relative; width: 56px; height: 56px; object-fit: contain; }
.cx-auth-hero h2 { font-family: var(--font-display); font-size: 30px; font-weight: 700; line-height: 1.1; letter-spacing: -0.02em; margin: 0 0 16px; color: var(--fg); }
@media (min-width: 1280px) { .cx-auth-hero h2 { font-size: 48px; } }
.cx-auth-hero p { color: var(--fg-muted); font-size: 16px; margin: 0; }
@media (min-width: 1280px) { .cx-auth-hero p { font-size: 18px; } }
.cx-auth-copy { margin-bottom: 24px; max-width: 576px; }
@media (min-width: 1280px) { .cx-auth-copy { margin-bottom: 40px; } }
.cx-auth-right { flex: 1; width: 100%; display: flex; flex-direction: column; position: relative; background: var(--bg); }
.cx-auth-mbg { position: absolute; inset: 0; background: url(gym-bg.jpg) center / cover; filter: brightness(.2) contrast(1.1); }
.cx-auth-mfade { position: absolute; inset: 0; background: linear-gradient(to top, var(--bg), rgba(10,10,10,.85), rgba(10,10,10,.5)); }
@media (min-width: 1024px) { .cx-auth-mbg, .cx-auth-mfade, .cx-auth-mlogo { display: none !important; } }
.cx-auth-mlogo { position: relative; z-index: 2; display: flex; justify-content: center; padding: max(2rem, env(safe-area-inset-top)) 0 8px; }
.cx-auth-mlogo .cx-auth-logo::before { inset: -24px; background: radial-gradient(ellipse at center, rgba(215,242,5,.14) 0%, transparent 70%); }
.cx-auth-mlogo img { width: 48px; height: 48px; }
.cx-auth-center { position: relative; z-index: 2; flex: 1; display: flex; align-items: center; justify-content: center; padding: 24px 16px; }
@media (min-width: 1024px) { .cx-auth-center { padding: 32px 40px; } }
.cx-auth-card { width: 100%; max-width: 440px; background: rgba(20,20,20,.95); backdrop-filter: blur(4px); border: 1px solid var(--border); border-radius: 16px; padding: 20px; box-shadow: 0 25px 50px -12px rgba(0,0,0,.2); }
@media (min-width: 640px) { .cx-auth-card { padding: 28px; } }
@media (min-width: 1024px) { .cx-auth-card { padding: 32px; } }
.cx-auth-card h1 { font-family: var(--font-display); font-size: 24px; font-weight: 700; line-height: 1.2; letter-spacing: -0.02em; margin: 0; color: var(--fg); }
@media (min-width: 640px) { .cx-auth-card h1 { font-size: 28px; } }
@media (min-width: 1024px) { .cx-auth-card h1 { font-size: 30px; } }
.cx-auth-card .lead-sub { color: var(--fg-muted); margin: 8px 0 0; font-size: 14px; }
.cx-auth-head { margin-bottom: 24px; }
@media (min-width: 640px) { .cx-auth-head { margin-bottom: 32px; } }
.cx-field { margin-bottom: 16px; position: relative; }
.cx-auth .cx-input { height: 48px; border-radius: 6px !important; }
.cx-eye { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; display: grid; place-items: center; border-radius: 6px; color: var(--fg-muted); background: transparent; border: 0; cursor: pointer; }
.cx-eye:hover { background: var(--surface-3); }
.cx-forgot { display: flex; justify-content: flex-end; padding-top: 4px; margin-bottom: 16px; }
.cx-forgot a { font-size: 14px; color: var(--primary) !important; }
.cx-auth-foot { margin-top: 24px; text-align: center; color: var(--fg-muted); font-size: 14px; }
.cx-auth-foot a { font-weight: 600; color: var(--primary) !important; }

/* utilitários */
.cx-flex { display: flex; align-items: center; }
.cx-gap-2 { gap: 8px; } .cx-gap-3 { gap: 12px; }
.cx-wrap { flex-wrap: wrap; }
.cx-between { justify-content: space-between; }
.cx-mt-2 { margin-top: 8px; } .cx-mt-4 { margin-top: 16px; } .cx-mt-6 { margin-top: 24px; } .cx-mb-3 { margin-bottom: 12px; } .cx-mb-4 { margin-bottom: 16px; } .cx-mb-6 { margin-bottom: 24px; }
.cx-space > * + * { margin-top: 16px; }
.cx-hide-sm { display: none; }
@media (min-width: 768px) { .cx-hide-sm { display: block; } .cx-only-sm { display: none !important; } }
.cx-small { font-size: 12px; } .cx-xs { font-size: 11px; }
.cx-bold { font-weight: 700; }
.cx-flex1 { flex: 1; min-width: 0; }
.cx-right { text-align: right; }
form.cx-inline { display: inline; margin: 0; }

/* Telas do aluno herdadas: cores e imagens no padrão Cactus */
.cx-main .text-primary,.cx-main .text-danger,.cx-main .text-pink{color:var(--primary)!important}
.cx-main .text-dark{color:var(--fg)!important}
.cx-main .btn-soft-primary,.cx-main .btn-outline-primary,.cx-main .btn-light{background:var(--primary)!important;color:var(--primary-fg)!important;border-color:var(--primary)!important}
.cx-main .card .img-fluid{max-height:360px;width:auto;margin:0 auto;display:block;border-radius:16px;object-fit:contain}

/* ---------- Profissionais (espelho da página Personais do Cactus) ---------- */
.cx-stickybar { background: rgba(10,10,10,.70) !important; border-bottom-color: rgba(255,255,255,.04) !important; backdrop-filter: blur(24px) !important; -webkit-backdrop-filter: blur(24px) !important; }
button.cx-back { background: transparent; border: 0; cursor: pointer; font-family: inherit; }
.pp-title { margin: 0; font-size: 20px !important; font-weight: 700 !important; letter-spacing: -0.025em !important; }
@media (min-width: 640px) { .pp-title { font-size: 24px !important; } }
.cx-btn-glow { border-radius: 9999px !important; padding: 8px 16px !important; font-size: 14px !important; font-weight: 600 !important; box-shadow: 0 0 20px rgba(76,175,80,.35) !important; }
.cx-btn-glow:hover { transform: none !important; filter: brightness(1.1); }
.pp-wrap { max-width: 1152px !important; padding-top: 24px !important; }
.pp-mt3 { margin-top: 12px; } .pp-mt4 { margin-top: 16px; } .pp-mt5 { margin-top: 20px; }
.pp-search { display: flex; align-items: center; gap: 8px; border: 1px solid var(--border); background: var(--surface-1); border-radius: 9999px; padding: 8px 16px; font-size: 14px; }
.pp-search input { width: 100%; background: transparent; border: 0; outline: none; color: var(--fg); font: inherit; }
.pp-search input::placeholder { color: var(--fg-secondary); }
.pp-cards { display: flex; flex-direction: column; gap: 12px; }
.pp-info { display: flex; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid var(--border); background: var(--surface-1); border-radius: 12px; padding: 16px; color: var(--fg) !important; transition: border-color .15s; }
.pp-info:hover { border-color: var(--border-strong); }
.pp-info:hover .cx-dim { color: var(--fg); }
.pp-info-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 8px; background: var(--primary-15); color: var(--primary); flex-shrink: 0; }
.pp-info-title { display: block; font-size: 14px; font-weight: 600; }
.pp-info-desc { display: block; margin-top: 2px; font-size: 12px; color: var(--fg-secondary); }
.pp-tabs { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px; border: 1px solid var(--border); background: var(--surface-1); border-radius: 9999px; padding: 4px; }
.pp-tabs a { border-radius: 9999px; padding: 6px 14px; font-size: 14px; color: var(--fg-secondary) !important; transition: background .15s, color .15s; }
.pp-tabs a span { margin-left: 4px; opacity: .7; }
.pp-tabs a:hover { background: var(--surface-3); color: var(--fg) !important; }
.pp-tabs a.active { background: var(--primary-15); color: var(--primary) !important; }
.pp-sortbtn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); background: var(--surface-1); border-radius: 9999px; padding: 6px 12px; font-size: 14px; color: var(--fg) !important; }
.pp-sortbtn:hover { background: var(--surface-3); }
.pp-count { margin: 12px 0 0; font-size: 14px; color: var(--fg-secondary); }
.pp-table { margin-top: 8px; overflow: hidden; border: 1px solid var(--border); background: var(--surface-1); border-radius: 12px; }
.pp-head, .pp-row { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 16px; }
@media (min-width: 640px) { .pp-head, .pp-row { grid-template-columns: 1.6fr 1fr 1fr auto; } }
.pp-head { border-bottom: 1px solid var(--border); padding: 12px 20px; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--fg-secondary); }
.pp-row { padding: 12px 16px; color: var(--fg) !important; transition: background .15s; border-top: 1px solid var(--border); }
.pp-head + .pp-row, .pp-table > .pp-row:first-child { border-top: 0; }
@media (min-width: 640px) { .pp-row { padding: 16px 20px; } }
.pp-row:hover { background: rgba(255,255,255,.03); }
.pp-av { width: 40px !important; height: 40px !important; margin: 0 !important; font-family: var(--font-display); font-weight: 700; box-shadow: 0 0 0 2px var(--primary); }
.pp-role { display: inline-flex; align-items: center; gap: 6px; border-radius: 9999px; background: rgba(59,130,246,.15); color: #60a5fa; padding: 2px 10px; font-size: 12px; font-weight: 500; }
.pp-chev { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; color: var(--fg-secondary); }
.pp-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 56px 24px; text-align: center; }
.pp-empty-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 9999px; background: var(--primary-10); color: var(--primary); margin-bottom: 8px; }

/* Telas internas do Cactus usam fundo sólido (bg-background cobre o brilho do body) */
body.cx.cx-flat { background-image: none !important; background-color: var(--bg) !important; }

/* =========================================================
   Foto do perfil — moldura oval (tela Atualizar Dados do Perfil)
   ========================================================= */
.cx-photo-round {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--surface-2);
  border: 2px solid var(--primary-40);
  box-shadow: none;
  cursor: pointer;
  transition: border-color .15s ease;
}
.cx-photo-round:hover { border-color: var(--primary); box-shadow: none; }
#profile_display {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

/* Edição de aluno e profissional — mesma composição do diálogo Cactus. */
.ce-page { min-height: 100dvh; display: flex; justify-content: center; align-items: flex-start; padding: 40px 16px; }
.ce-panel { width: 100%; max-width: 448px; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; background: var(--bg); }
.ce-head { position: relative; display: flex; align-items: center; gap: 16px; padding: 20px 24px; padding-right: 44px; border-bottom: 1px solid var(--border); background: linear-gradient(135deg, var(--primary-10), transparent); }
.ce-avatar { flex-shrink: 0; width: 56px !important; height: 56px !important; margin: 0 !important; border-radius: 50%; font-family: var(--font-display); font-size: 18px; font-weight: 700; box-shadow: 0 0 0 2px var(--primary-40); }
.ce-heading { min-width: 0; }
.ce-heading h1 { margin: 0; font-family: var(--font-display); color: var(--fg); font-size: 18px; line-height: 1.4; font-weight: 600; letter-spacing: 0; }
.ce-heading p { margin: 2px 0 0; font-size: 12px; color: var(--fg-secondary); }
.ce-close { position: absolute; top: 12px; right: 10px; opacity: .7; }
.ce-fields { display: grid; gap: 16px; padding: 20px 24px; }
.ce-field { display: flex; min-width: 0; flex-direction: column; gap: 6px; }
.ce-field label { margin: 0; font-size: 12px; font-weight: 500; color: var(--fg-secondary); }
.ce-field label span { opacity: .7; }
.ce-panel .form-control { height: 40px; padding: 0 12px; border-radius: 6px !important; background: var(--bg) !important; font-family: var(--font-body); }
.ce-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.ce-additional { display: grid; gap: 16px; border-top: 1px solid var(--border); padding-top: 16px; }
.ce-footer { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 24px; border-top: 1px solid var(--border); background: var(--bg-elevated); }
.ce-footer .cx-btn { height: 36px; padding: 8px 16px; border-radius: 6px; font-size: 14px; }
.ce-footer .cx-btn-primary:hover { transform: none; }
.ce-footer .cx-btn:disabled { cursor: wait; opacity: .6; box-shadow: none; }
.ce-fields .cx-alert { margin: 0; }
@media (min-width: 640px) { .ce-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .ce-page { min-height: auto; padding: 24px 12px 96px; } }

/* Perfil do Aluno — composição e raios iguais à referência Cactus. */
.sp-profile { --sp-radius: 12px; --sp-item-radius: 8px; padding-top: 16px; }
.sp-top { justify-content: flex-start; gap: 8px; padding: 16px; }
.sp-top h1 { font-family: var(--font-display); font-size: 20px; letter-spacing: 0; }
.sp-summary, .sp-tabs-shell { background: var(--surface-1); border: 1px solid var(--border); border-radius: var(--sp-radius); }
.sp-summary { padding: 20px; }
.sp-identity { gap: 16px; }
.sp-name { margin: 0; font-family: var(--font-display); font-size: 20px; font-weight: 700; }
.sp-summary .cx-icon-btn { width: 28px; height: 28px; flex-shrink: 0; }
.sp-access { padding: 16px; border-radius: var(--sp-radius); }
.sp-access:hover { background: var(--surface-3); border-color: var(--border); }
.sp-tabs-shell { overflow: hidden; }
.sp-tab-body { padding: 20px; }
.sp-tab-body[hidden] { display: none; }
.sp-profile .cx-section-label { color: var(--fg-secondary); letter-spacing: 0; }
.sp-profile .cx-btn { font-size: 14px; font-weight: 600; padding: 8px 14px; }
.sp-profile .cx-btn-primary { box-shadow: none; }
.sp-profile .cx-btn-primary:hover { transform: none; box-shadow: none; }
.sp-profile .cx-btn-outline { background: var(--bg); }
.sp-plan { padding: 16px; border: 1px solid var(--border); border-radius: var(--sp-item-radius); background: color-mix(in srgb, var(--surface-2) 30%, transparent); transition: background .15s; }
.sp-plan:hover { background: color-mix(in srgb, var(--surface-2) 50%, transparent); }
.sp-plan-status { margin-left: auto; font-size: 10px; padding: 2px 12px; border: 1px solid var(--border); }
.sp-plan-status.cx-pill-primary { color: var(--success); border-color: color-mix(in srgb, var(--success) 30%, transparent); background: color-mix(in srgb, var(--success) 15%, transparent); }
.sp-empty { padding: 48px 24px; border-color: var(--border); border-radius: var(--sp-item-radius); background: color-mix(in srgb, var(--surface-2) 20%, transparent); }
.sp-empty .cx-empty-icon { background: var(--surface-3); }
.sp-info-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.sp-details { display: grid; gap: 12px; margin: 12px 0 0; }
.sp-details > div { display: flex; align-items: center; gap: 12px; min-width: 0; }
.sp-details .cx-icon { flex-shrink: 0; color: var(--fg-secondary); }
.sp-details span { min-width: 0; }
.sp-details dt { font-size: 12px; font-weight: 500; color: var(--fg-secondary); }
.sp-details dd { margin: 0; font-size: 14px; overflow-wrap: anywhere; }
.sp-info-footer { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--border); display: grid; gap: 16px; }
.sp-toggle.cx-btn-danger { border-color: transparent; background: transparent; color: var(--warning) !important; }
.sp-toggle.cx-btn-danger:hover { background: color-mix(in srgb, var(--warning) 10%, transparent); }
.sp-dates { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; color: var(--fg-secondary); font-size: 12px; }
@media (min-width: 640px) { .sp-top h1 { font-size: 24px; } .sp-top { padding-right: 24px; padding-left: 24px; } }
@media (min-width: 768px) { .sp-top { padding-left: 32px; padding-right: 32px; } .sp-profile { padding: 24px; } .sp-summary, .sp-tab-body { padding: 24px; } .sp-name { font-size: 24px; } .sp-info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639px) { .sp-profile .cx-btn { white-space: normal; } .sp-plan > .cx-flex { flex-wrap: wrap; } .sp-plan .cx-flex1 { flex-basis: 100%; } }

/* =========================================================
   Plano de treino (tp-*) e editor de plano (we-*) — modelo Cactus
   ========================================================= */
.tp-header { position: sticky; top: 0; z-index: 40; border-bottom: 1px solid var(--border); background: rgba(10,10,10,.7); backdrop-filter: blur(12px); padding: 16px; }
.tp-wrap { max-width: 1152px; margin: 0 auto; }
.tp-head-row { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.tp-back { padding: 4px; color: var(--fg-muted) !important; display: inline-flex; }
.tp-back:hover { color: var(--fg) !important; }
.cx .tp-title { font-size: 18px; font-weight: 700; margin: 0; }
.tp-sub { margin: 2px 0 0; font-size: 12px; color: var(--fg-muted); }
.tp-badge-active { display: inline-flex; align-items: center; border-radius: 999px; border: 1px solid rgba(34,197,94,.3); background: rgba(34,197,94,.15); padding: 2px 8px; font-size: 12px; font-weight: 600; color: #4ade80; }
.tp-main { padding: 16px; }
.tp-grid { display: flex; flex-direction: column; gap: 24px; }
.tp-col-main { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.tp-card { overflow: hidden; border-radius: 12px; border: 1px solid var(--border); background: var(--surface-1); }
.tp-empty { border-radius: 12px; border: 1px dashed var(--border-strong); background: color-mix(in srgb, var(--surface-2) 20%, transparent); padding: 32px; text-align: center; font-size: 14px; color: var(--fg-muted); }
.tp-stats { display: grid; grid-template-columns: 1fr 1fr; }
.tp-stat { display: flex; flex-direction: column; align-items: center; padding: 12px 8px; text-align: center; }
.tp-stat + .tp-stat { border-left: 1px solid var(--border); }
.tp-stat-v { font-family: var(--font-display); font-size: 18px; font-weight: 700; line-height: 1; color: var(--fg); }
.tp-stat-l { margin-top: 4px; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: var(--fg-muted); }
.cx .tp-section { margin: 0 0 12px; font-family: var(--font-body) !important; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--fg-muted); }
.tp-stack { display: flex; flex-direction: column; gap: 8px; }
.tp-session-btn { display: flex; width: 100%; align-items: center; gap: 12px; padding: 16px; background: none; border: 0; color: var(--fg); cursor: pointer; transition: background .15s; }
.tp-session-btn:hover { background: color-mix(in srgb, var(--surface-2) 50%, transparent); }
.tp-num { display: grid; place-items: center; width: 32px; height: 32px; flex-shrink: 0; border-radius: 50%; background: var(--primary-10); color: var(--primary); font-size: 12px; font-weight: 700; }
.tp-session-name { display: block; font-size: 14px; font-weight: 500; }
.tp-session-meta { display: block; font-size: 12px; color: var(--fg-muted); }
.tp-chev-up, .tp-session.open .tp-chev-down { display: none; }
.tp-session.open .tp-chev-up, .tp-chev-down { display: inline-flex; color: var(--fg-muted); }
.tp-session-body { display: none; flex-direction: column; gap: 8px; border-top: 1px solid var(--border); padding: 16px; }
.tp-session.open .tp-session-body { display: flex; }
.tp-ex { display: flex; height: 72px; width: 100%; align-items: center; gap: 10px; border-radius: 8px; border: 0; background: color-mix(in srgb, var(--surface-2) 20%, transparent); padding: 12px; text-align: left; color: var(--fg); cursor: pointer; transition: all .15s; }
.tp-ex:hover { background: color-mix(in srgb, var(--surface-2) 40%, transparent); }
.tp-ex:active { transform: scale(.98); }
.tp-ex-num { display: grid; place-items: center; width: 20px; height: 20px; flex-shrink: 0; border-radius: 50%; background: var(--primary-10); color: var(--primary); font-size: 10px; font-weight: 700; }
.tp-ex-icon { display: grid; place-items: center; width: 32px; height: 32px; flex-shrink: 0; border-radius: 6px; background: var(--surface-3); color: var(--fg-muted); }
.tp-ex-text { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 2px; overflow: hidden; }
.tp-ex-name { display: block; font-size: 14px; font-weight: 500; }
.tp-ex-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12px; color: var(--fg-muted); font-variant-numeric: tabular-nums; }
.tp-dot { color: color-mix(in srgb, var(--fg-muted) 40%, transparent); }
.tp-hr { height: 1px; background: var(--border); }
.tp-aside-title { margin-top: 24px !important; }
.tp-actions { display: flex; flex-direction: column; gap: 8px; }
.tp-actions form { margin: 0; }
.tp-action { display: inline-flex; height: 48px; width: 100%; align-items: center; justify-content: center; gap: 8px; border-radius: 999px; border: 1px solid var(--border-strong); background: transparent; padding: 10px 24px; font-size: 14px; font-weight: 600; color: var(--fg) !important; cursor: pointer; transition: all .15s; white-space: nowrap; }
.tp-action:hover { border-color: var(--primary); color: var(--primary) !important; }
.tp-action:active { transform: scale(.97); }
.tp-action:disabled { opacity: .5; cursor: not-allowed; }
.tp-action.danger, .tp-action.danger:hover { color: var(--destructive) !important; }
.tp-action.danger:hover { border-color: var(--destructive); }
@media (min-width: 768px) { .tp-header { padding: 24px; } .cx .tp-title { font-size: 20px; } .tp-main { padding: 24px; } .tp-stat-v { font-size: 20px; } .tp-stat-l { font-size: 12px; } }
@media (min-width: 1024px) {
  .tp-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; }
  .tp-aside { position: sticky; top: 96px; align-self: start; }
  .tp-hr { display: none; } .tp-aside-title { margin-top: 0 !important; }
}
/* diálogos de confirmação e detalhe */
.cx .modal-content.tp-alert { padding: 24px; border-radius: 12px !important; border: 1px solid var(--border) !important; background: var(--surface-1); box-shadow:var(--dialog-shadow); }
.cx .tp-alert-title { margin: 0 0 8px; font-family:var(--font-display); font-size: 18px; line-height:28px; font-weight: 600; letter-spacing:0; }
.tp-alert-desc { margin: 0; font-size: 14px; line-height:20px; color: var(--fg-muted); }
.tp-alert-desc strong { color: var(--fg); }
.tp-alert-foot { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; margin: 20px 0 0; }
.tp-pill { display: inline-flex; height: 40px; align-items: center; justify-content: center; gap: 6px; border-radius: 999px; border: 1px solid var(--border-strong); background: var(--surface-2); padding: 0 20px; font-size: 14px; font-weight: 600; color: var(--fg); cursor: pointer; }
.tp-pill:hover { background: var(--surface-3); }
.tp-pill.primary { background: var(--primary); border-color: var(--primary); color: var(--primary-fg); }
.tp-pill.primary:hover { filter: brightness(1.05); }
.tp-pill.danger { border-color: rgba(239,68,68,.6); background: rgba(239,68,68,.1); color: var(--destructive); }
.tp-pill.danger-outline { border-color: rgba(239,68,68,.6); background: transparent; color: var(--destructive); }
.tp-pill:disabled { opacity: .5; }
.cx .modal-content.tp-exdlg { padding: 0; overflow: hidden; border-radius: 12px; border: 1px solid var(--border-strong); background: var(--surface-1); }
.tp-exdlg-head { display: flex; align-items: flex-start; gap: 12px; padding: 16px; border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--surface-2) 40%, transparent); }
.tp-exdlg-icon { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; border-radius: 8px; background: var(--primary-10); color: var(--primary); }
.cx .tp-exdlg-title { margin: 0 0 4px; font-size: 16px; font-weight: 700; }
.tp-exdlg-body { display: flex; flex-direction: column; gap: 16px; max-height: 70vh; overflow-y: auto; padding: 16px; font-size: 14px; }
.tp-exdlg-img { overflow: hidden; border-radius: 8px; border: 1px solid var(--border); background: var(--surface-2); }
.tp-exdlg-img img { display: block; width: 100%; height: auto; object-fit: cover; }
.tp-chip { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; border: 1px solid var(--border-strong); background: color-mix(in srgb, var(--surface-2) 60%, transparent); padding: 4px 10px; font-size: 12px; color: var(--fg-secondary); }
.cx .tp-mini, .we-mini { margin: 0 0 6px; font-family: var(--font-body) !important; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--fg-muted); }
.tp-tag { display: inline-block; border-radius: 999px; background: var(--primary-10); padding: 4px 10px; font-size: 12px; font-weight: 500; color: var(--primary); }
.tp-video { display: inline-flex; height: 40px; align-items: center; justify-content: center; align-self: flex-start; border-radius: 999px; border: 1px solid var(--primary-40); background: var(--primary-10); padding: 0 16px; font-size: 12px; font-weight: 600; color: var(--primary) !important; }
.sp-plan-link { display: block; color: var(--fg) !important; transition: border-color .15s, background .15s; }
.sp-plan-link:hover { border-color: var(--primary-40) !important; background: color-mix(in srgb, var(--surface-2) 50%, transparent) !important; }
@media print {
  .cx-rail, .cx-bnav, .cx-mtop, .tp-aside, .tp-back, .tp-badge-active, .cx-flash, .alert { display: none !important; }
  body.cx, html { background: #fff !important; color: #000 !important; }
  .cx-main { padding: 0 !important; margin: 0 !important; }
  .tp-header { position: static; background: #fff; border-color: rgba(0,0,0,.2); backdrop-filter: none; }
  .tp-title, .tp-sub, .tp-stat-v, .tp-session-name, .tp-ex-name { color: #000 !important; }
  .tp-grid { display: block; }
  .tp-card, .tp-ex { background: #fff !important; border-color: rgba(0,0,0,.2) !important; break-inside: avoid; }
  .tp-session-body { display: flex !important; }
  .tp-chev-up, .tp-chev-down { display: none !important; }
}

/* ---------- editor ---------- */
.we { min-height: 100vh; color: var(--fg); padding-bottom: 96px; }
.we-header { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--border); background: rgba(10,10,10,.9); backdrop-filter: blur(12px); }
.we-back { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; color: var(--fg-secondary) !important; white-space: nowrap; }
.we-back:hover { color: var(--fg) !important; }
.cx .we-htitle { margin: 0; font-family: var(--font-body) !important; font-size: 14px; font-weight: 600; }
.we-warn { display: none; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; color: var(--warning); }
.we-warn:not([hidden]) { display: none; }
@media (min-width: 640px) { .we-warn:not([hidden]) { display: inline-flex; } }
.we-save { display: inline-flex; height: 36px; align-items: center; gap: 6px; border: 0; border-radius: 999px; background: var(--primary); padding: 0 16px; font-size: 14px; font-weight: 600; color: var(--primary-fg); cursor: pointer; white-space: nowrap; }
.we-save:hover { filter: brightness(1.05); }
.we-save:disabled { opacity: .5; cursor: not-allowed; }
.we-outline { display: inline-flex; height: 36px; align-items: center; gap: 6px; border-radius: 999px; border: 1px solid var(--border-strong); background: var(--surface-1); padding: 0 16px; font-size: 14px; font-weight: 500; color: var(--fg); cursor: pointer; white-space: nowrap; }
.we-outline:hover { background: var(--surface-3); }
.we-hide-sm { display: none; }
@media (min-width: 640px) { .we-hide-sm { display: inline-flex; } }
.we-round { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--border-strong); background: var(--surface-1); color: var(--fg); cursor: pointer; }
.we-round:hover { background: var(--surface-3); }
.we-pop-anchor { position: relative; }
.we-pop { display: none; position: absolute; top: calc(100% + 6px); left: 0; z-index: 60; border-radius: 10px; border: 1px solid var(--border-strong); background: var(--surface-2); padding: 12px; box-shadow: 0 16px 40px rgba(0,0,0,.5); }
.we-pop.open { display: block; }
.we-menu { padding: 6px; }
.we-menu > button, .we-menu > a { display: flex; width: 100%; align-items: center; gap: 8px; border: 0; border-radius: 6px; background: none; padding: 8px; font-size: 14px; color: var(--fg) !important; text-align: left; cursor: pointer; }
.we-menu > button:hover, .we-menu > a:hover, .we-menu > button.active { background: var(--surface-4); }
.we-menu > button:disabled { opacity: .4; cursor: default; background: none; }
.we-menu > .danger { color: var(--destructive) !important; }
.we-main { padding: 16px 12px; }
@media (min-width: 640px) { .we-main { padding: 20px 16px; } }
@media (min-width: 768px) { .we-main { padding: 20px 24px; } .we-header { padding: 12px 24px; } .cx .we-htitle { font-size: 16px; } }
.we-namerow { display: flex; flex-direction: column; gap: 12px; }
@media (min-width: 1024px) { .we-namerow { flex-direction: row; align-items: center; } }
.we-namebox { position: relative; flex: 1; margin: 0; border-radius: 8px; border: 1px solid color-mix(in srgb, var(--border-strong) 50%, transparent); background: color-mix(in srgb, var(--surface-1) 40%, transparent); padding: 12px 16px; cursor: text; transition: border-color .15s, box-shadow .15s; }
.we-namebox:hover { border-color: var(--border-strong); }
.we-namebox:focus-within { border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-40); }
.we-namebox input { width: 100%; border: 0; outline: 0; background: transparent; padding: 0 32px 0 0; font-size: 20px; font-weight: 600; letter-spacing: -.01em; color: var(--fg); caret-color: var(--primary); }
.we-namebox input::placeholder { color: color-mix(in srgb, var(--fg) 60%, transparent); }
.we-name-pencil { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--fg-muted); opacity: 0; transition: opacity .15s; pointer-events: none; }
.we-namebox:hover .we-name-pencil { opacity: 1; }
.we-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
@media (min-width: 1024px) { .we-chips { flex-shrink: 0; } }
.we-chip { display: inline-flex; height: 28px; align-items: center; gap: 6px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--border-strong) 70%, transparent); background: color-mix(in srgb, var(--surface-1) 60%, transparent); padding: 0 10px; font-size: 11px; font-weight: 500; color: var(--fg) !important; cursor: pointer; white-space: nowrap; }
.we-chip:hover { background: var(--surface-3); }
.we-chip .cx-icon { color: var(--fg-muted); }
.we-badge-on { border-color: rgba(74,222,128,.4); background: rgba(74,222,128,.1); color: #4ade80 !important; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; cursor: default; }
.we-badge-on .cx-icon { color: #4ade80; }
.we-badge-arch { border-color: var(--border-strong); background: var(--surface-3); color: var(--fg-secondary) !important; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; cursor: default; }
.we-label { display: block; margin: 0 0 4px; font-size: 12px; font-weight: 500; color: var(--fg-secondary); }
.we-input { width: 100%; height: 36px; border-radius: 6px; border: 1px solid var(--border-strong); background: var(--surface-1); padding: 0 10px; font-size: 14px; color: var(--fg); outline: 0; color-scheme: dark; }
.we-input:focus { border-color: var(--primary); }
.we-preset { height: 28px; border-radius: 999px; border: 1px solid var(--border-strong); background: none; padding: 0 10px; font-size: 12px; color: var(--fg-secondary); cursor: pointer; }
.we-preset:hover { background: var(--surface-3); }
.we-preset.active { border-color: var(--primary); background: var(--primary-10); color: var(--primary); }
.we-desc { display: block; width: 100%; min-height: 36px; margin-top: 4px; resize: none; border: 0; outline: 0; background: transparent; padding: 4px 16px; font-size: 16px; color: var(--fg-secondary); overflow: hidden; }
.we-desc::placeholder { color: color-mix(in srgb, var(--fg-secondary) 70%, transparent); }
.we-bar { margin-top: 16px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid color-mix(in srgb, var(--border-strong) 50%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--border-strong) 50%, transparent); padding: 12px 0; min-height: 53px; }
.we-objective { font-size: 13px; padding: 0 8px; }
.we-warn-text { color: var(--warning); }
.we-vol-head { border-bottom: 1px solid var(--border); padding: 12px 16px; }
.we-vol-nums { display: flex; align-items: baseline; gap: 8px; margin-top: 8px; }
.we-vol-nums b { font-size: 24px; font-weight: 700; }
.we-vol-nums b.sm { font-size: 18px; }
.we-vol-nums small { font-size: 12px; color: var(--fg-muted); }
.we-vol-nums i { font-style: normal; color: var(--fg-dim); }
.we-vol-list { max-height: 300px; overflow-y: auto; padding: 12px 16px; display: flex; flex-direction: column; gap: 8px; font-size: 12px; }
.we-vol-bar { height: 6px; margin-top: 4px; border-radius: 999px; background: var(--surface-4); overflow: hidden; }
.we-vol-bar span { display: block; height: 100%; border-radius: 999px; background: var(--primary); }
.we-vol-foot { border-top: 1px solid var(--border); padding: 8px 16px; font-size: 10px; color: var(--fg-muted); }
.we-sessions { margin: 16px -4px 0; padding: 0 4px 12px; display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
@media (min-width: 640px) { .we-sessions { flex-direction: row; align-items: flex-start; overflow-x: auto; min-height: calc(100dvh - 240px); } }
.we-scard { width: 100%; flex: none; overflow: visible; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--border-strong) 60%, transparent); background: color-mix(in srgb, var(--surface-1) 60%, transparent); transition: border-color .15s; }
.we-scard.active { border-color: var(--primary-40); }
@media (min-width: 640px) { .we-scard { width: 360px; } }
.we-scard-head { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid color-mix(in srgb, var(--border-strong) 60%, transparent); padding: 12px 16px; }
.we-grip { display: inline-flex; flex-shrink: 0; color: var(--fg-dim); cursor: grab; }
.we-letter { display: grid; place-items: center; width: 28px; height: 28px; flex-shrink: 0; border-radius: 6px; background: var(--primary-15); color: var(--primary); font-size: 11px; font-weight: 700; }
.we-day { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; font-size: 14px; font-weight: 600; color: var(--fg); cursor: pointer; color-scheme: dark; }
.we-day option { background: var(--surface-2); }
.we-ibtn { display: grid; place-items: center; width: 28px; height: 28px; flex-shrink: 0; border: 0; border-radius: 4px; background: none; color: var(--fg-muted); cursor: pointer; }
.we-ibtn:hover { background: var(--surface-3); color: var(--fg); }
.we-ibtn.rm:hover { background: rgba(239,68,68,.1); color: var(--destructive); }
.we-svol { display: flex; align-items: center; gap: 6px; border-bottom: 1px solid color-mix(in srgb, var(--border-strong) 60%, transparent); background: rgba(10,10,10,.3); padding: 8px 12px; font-size: 12px; color: var(--fg-muted); }
.we-svol svg { color: var(--primary); opacity: .7; }
.we-svol strong { color: var(--fg); font-weight: 500; }
.we-sbody { display: flex; flex-direction: column; gap: 8px; padding: 12px; }
.we-exrow { position: relative; display: flex; align-items: center; gap: 8px; border-radius: 8px; border: 1px solid color-mix(in srgb, var(--border-strong) 60%, transparent); background: color-mix(in srgb, var(--surface-3) 40%, transparent); padding: 6px 8px; cursor: pointer; transition: background .15s; }
.we-exrow:hover { background: var(--surface-3); }
.we-exrow.dragging { opacity: .6; }
.we-play { display: grid; place-items: center; width: 28px; height: 28px; flex-shrink: 0; border-radius: 6px; background: var(--surface-3); }
.we-play > span { display: grid; place-items: center; width: 14px; height: 14px; border-radius: 50%; background: var(--primary); color: var(--primary-fg); }
.we-play > span svg { width: 8px; height: 8px; margin-left: 1px; }
.we-play.lg { width: 48px; height: 48px; }
.we-play.lg > span { width: 24px; height: 24px; }
.we-play.lg > span svg { width: 12px; height: 12px; }
.we-exinfo { display: flex; min-width: 0; flex: 1; flex-direction: column; }
.we-exname { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; font-size: 13px; font-weight: 500; line-height: 1.35; color: var(--fg); }
.we-exmeta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 10px; color: var(--fg-muted); }
.we-exmeta > span { display: inline-flex; align-items: center; gap: 3px; }
.we-exmeta svg { width: 10px; height: 10px; }
.we-load { border-radius: 999px; background: var(--primary-10); padding: 1px 6px; color: var(--primary); font-weight: 500; }
.we-load.muted { background: var(--surface-4); color: var(--fg-muted); }
.we-addex { display: inline-flex; width: 100%; align-items: center; justify-content: center; gap: 8px; border-radius: 12px; border: 1px dashed color-mix(in srgb, var(--border-strong) 70%, transparent); background: rgba(10,10,10,.3); padding: 12px 0; font-size: 14px; font-weight: 500; color: var(--fg-muted); cursor: pointer; transition: all .15s; }
.we-addex:hover { border-color: var(--primary); color: var(--primary); background: var(--surface-3); }
.we-addsess { display: inline-flex; height: 44px; width: 100%; flex: none; align-items: center; justify-content: center; gap: 8px; border-radius: 999px; border: 1px dashed color-mix(in srgb, var(--border-strong) 70%, transparent); background: none; padding: 0 16px; font-size: 14px; font-weight: 500; color: var(--fg-muted); cursor: pointer; }
.we-addsess:hover { background: var(--surface-3); }
@media (min-width: 640px) { .we-addsess { width: auto; min-width: 220px; } }
/* painéis laterais */
.we-sheet-backdrop { display: none; position: fixed; inset: 0; z-index: 1040; background: rgba(0,0,0,.6); }
.we-sheet-backdrop.open { display: block; }
.we-sheet { position: fixed; top: 0; right: 0; bottom: 0; z-index: 1041; width: 100%; max-width: 448px; overflow-y: auto; border-left: 1px solid var(--border-strong); background: var(--surface-1); transform: translateX(100%); transition: transform .25s ease; }
.we-sheet.open { transform: none; }
.we-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 24px 0; }
.cx .we-sheet-head h3 { margin: 0; font-size: 18px; font-weight: 600; }
.we-sheet-body { display: flex; flex-direction: column; gap: 16px; padding: 16px 24px 24px; }
.we-field { display: flex; flex-direction: column; }
.we-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.we-switch-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0; border-radius: 8px; border: 1px solid var(--border-strong); padding: 12px; cursor: pointer; }
.we-switch { appearance: none; width: 40px; height: 22px; flex-shrink: 0; border-radius: 999px; background: var(--surface-4); position: relative; cursor: pointer; transition: background .15s; }
.we-switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--fg); transition: transform .15s; }
.we-switch:checked { background: var(--primary); }
.we-switch:checked::after { transform: translateX(18px); background: var(--primary-fg); }
.we-danger-btn { display: inline-flex; height: 40px; align-items: center; justify-content: center; gap: 6px; border-radius: 999px; border: 1px solid rgba(239,68,68,.6); background: transparent; font-size: 14px; font-weight: 600; color: var(--destructive); cursor: pointer; }
.we-danger-btn:hover { background: rgba(239,68,68,.1); }
/* biblioteca */
.cx .modal-content.we-picker { display: flex; flex-direction: column; height: 85vh; max-height: 720px; padding: 0; overflow: hidden; border-radius: 12px; border: 1px solid var(--border-strong); background: var(--surface-1); }
.we-picker-head { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--border); padding: 12px 20px; }
.cx .we-picker-head h4 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 18px; font-weight: 600; }
.we-picker-target { padding: 10px 20px 0; font-size: 12px; color: var(--fg-muted); }
.we-picker-target strong { color: var(--primary); }
.we-picker-search { display: flex; gap: 8px; padding: 12px; }
.we-search { position: relative; flex: 1; }
.we-search .cx-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--fg-muted); }
.we-search input { width: 100%; height: 40px; border-radius: 6px; border: 1px solid var(--border-strong); background: var(--surface-2); padding: 0 12px 0 36px; font-size: 14px; color: var(--fg); outline: 0; }
.we-search input:focus { border-color: var(--primary); }
.we-filter { display: inline-flex; height: 40px; align-items: center; border-radius: 6px; border: 1px solid var(--border-strong); background: none; padding: 0 12px; color: var(--fg-muted); cursor: pointer; }
.we-filter.on { border-color: var(--primary-40); color: var(--primary); }
.we-picker-list { flex: 1; min-height: 0; overflow-y: auto; border-top: 1px solid var(--border); padding: 8px 12px; display: flex; flex-direction: column; gap: 8px; }
.we-pick { display: flex; width: 100%; align-items: center; gap: 12px; border-radius: 12px; border: 1px solid var(--border-strong); background: var(--surface-2); padding: 12px; text-align: left; color: var(--fg); cursor: pointer; transition: all .15s; }
.we-pick:hover { border-color: rgba(255,255,255,.3); background: var(--surface-3); }
.we-pick:active { transform: scale(.99); }
.we-pick.on { border-color: rgba(215,242,5,.6); background: rgba(215,242,5,.05); }
.we-pick .we-exname { font-size: 14px; -webkit-line-clamp: 1; }
.we-pick .we-exmeta { font-size: 11px; margin-top: 4px; }
.we-check { display: grid; place-items: center; width: 24px; height: 24px; flex-shrink: 0; border-radius: 50%; border: 2px solid var(--border-strong); color: var(--primary-fg); }
.we-pick.on .we-check { border-color: var(--primary); background: var(--primary); }
.we-pick-empty { margin: 8px; border-radius: 8px; border: 1px dashed var(--border-strong); padding: 24px; text-align: center; font-size: 12px; color: var(--fg-muted); }
.we-picker-foot { display: flex; flex-shrink: 0; align-items: center; gap: 10px; border-top: 1px solid var(--border); background: var(--surface-2); padding: 12px; }
.we-picker-foot[hidden] { display: none; }
.we-sel-count { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%; border: 2px solid var(--primary); background: var(--primary-15); font-size: 14px; font-weight: 700; color: var(--primary); }
.we-picker-foot .we-save { height: 40px; padding: 0 20px; }
.we-warn-icon { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%; background: rgba(250,204,21,.15); color: #facc15; }
.we-leave-info { display: flex; align-items: flex-start; gap: 8px; margin-top: 12px; border-radius: 8px; border: 1px solid rgba(251,146,60,.4); background: rgba(251,146,60,.1); padding: 8px 12px; font-size: 12px; color: #facc15; }
.we-leave-info[hidden] { display: none; }
.we-toasts { position: fixed; right: 16px; bottom: 16px; z-index: 2000; display: flex; flex-direction: column; gap: 8px; max-width: 360px; }
@media (max-width: 767px) { .we-toasts { bottom: 84px; left: 16px; } }
.we-toast { display: flex; flex-direction: column; gap: 2px; border-radius: 10px; border: 1px solid var(--border-strong); background: var(--surface-2); padding: 12px 16px; font-size: 13px; color: var(--fg); box-shadow: 0 12px 30px rgba(0,0,0,.5); transition: opacity .3s, transform .3s; }
.we-toast span { font-size: 12px; color: var(--fg-secondary); }
.we-toast.ok strong { color: var(--primary); }
.we-toast.err strong { color: var(--destructive); }
.we-toast.out { opacity: 0; transform: translateY(8px); }

/* Editor: geometria do WorkoutEditor Cactus, sem alterar as demais telas. */
.we, .we-sheet, .we-picker { --we-radius-sm: 6px; --we-radius-md: 10px; --we-radius-lg: 16px; --we-radius-xl: 24px; --we-radius-2xl: 28px; --we-radius-full: 9999px; --we-border: color-mix(in srgb, var(--border) 60%, transparent); --we-overlay: color-mix(in srgb, var(--primary-fg) 80%, transparent); }
.we :is(input,textarea), .we-sheet :is(input,textarea) { font-family: var(--font-body); letter-spacing: 0; }
.we-header { background: color-mix(in srgb, var(--bg) 90%, transparent); }
.we-namebox,.we-bar { border-color: color-mix(in srgb, var(--border) 50%, transparent); }
.we-scard { border-color: var(--we-border); }
.we-scard.active { border-color: var(--we-border); }
.we-scard-head,.we-svol { border-color: var(--we-border); }
.we-block { display:flex; flex-direction:column; gap:8px; padding:12px; border:1px solid var(--we-border); border-radius:8px; }
.we-scard.active .we-block { outline:1px solid var(--primary-40); }
.we-exrow { border-color:var(--we-border); background:color-mix(in srgb,var(--surface-3) 40%,transparent); }
.we-block .we-addex { border-radius:8px; padding:10px 0; background:transparent; }
.we-exmeta { color:var(--fg-secondary); }
.we-exmeta > span:has(svg), .we-exmeta > .cx-primary { display:none; }
.we-chip { border-color:color-mix(in srgb,var(--border) 70%,transparent); }
.we-sheet-backdrop { background:color-mix(in srgb,var(--primary-fg) 80%,transparent); }
body.we-sheet-open { overflow:hidden; }
#weExercise { display:flex; flex-direction:column; width:100%; max-width:100%; overflow:hidden; background:var(--bg); border-color:var(--border); visibility:hidden; }
#weExercise.open { visibility:visible; }
@media(min-width:640px) { #weExercise { max-width:420px; } }
@media(min-width:1024px) { #weExercise { max-width:460px; } }
.we-detail-head { display:flex; flex-shrink:0; align-items:center; gap:8px; padding:12px; border-bottom:1px solid var(--border); }
.we-detail-back { display:flex; align-items:center; gap:6px; padding:8px; margin-left:-8px; border:0; border-radius:6px; background:transparent; color:var(--fg-secondary); font-size:14px; cursor:pointer; }
.we-detail-back:hover { background:var(--surface-3); color:var(--fg); }
.we-detail-title { min-width:0; flex:1; text-align:center; }
.we-detail-title > span { display:block; font-size:10px; font-weight:700; text-transform:uppercase; color:var(--fg-secondary); }
.cx .we-detail-title h3 { margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:var(--font-body) !important; font-size:16px; font-weight:600; }
.we-detail-trash { display:grid; place-items:center; flex-shrink:0; width:36px; height:36px; border:0; border-radius:6px; background:var(--surface-3); color:var(--fg-secondary); cursor:pointer; }
.we-detail-trash:hover,.we-series-remove:hover { background:color-mix(in srgb,var(--destructive) 10%,transparent); color:var(--destructive); }
#weExercise .we-sheet-body { min-height:0; flex:1; overflow-y:auto; padding:16px; gap:16px; }
#weExercise .we-sheet-body > * { flex-shrink:0; }
.we-detail-media { position:relative; display:grid; place-items:center; flex-shrink:0; width:100%; aspect-ratio:16/9; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:var(--surface-3); }
.we-detail-media :is(video,img,iframe) { width:100%; height:100%; object-fit:contain; border:0; }
.we-media-play { display:grid; place-items:center; width:48px; height:48px; border-radius:50%; background:var(--primary); color:var(--primary-fg); }
.we-media-play svg { width:20px; height:20px; }
.we-detail-muscles { padding:0 4px; font-size:11px; color:var(--fg-secondary); }
.we-detail-muscles p { margin:0 0 12px; }
.we-detail-muscles > div { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.we-detail-muscles span,.cx .we-series h4 { font-size:10px; font-weight:700; text-transform:uppercase; color:var(--fg-secondary); }
.we-detail-muscles strong { border-radius:999px; padding:2px 8px; background:var(--primary-15); color:var(--primary); font-weight:500; }
.cx .we-series h4 { margin:0 4px 8px; font-family:var(--font-body) !important; letter-spacing:0; }
.we-series-head,.we-series-row { display:grid; grid-template-columns:20px minmax(90px,1.5fr) minmax(66px,1fr) minmax(68px,.9fr) 28px; align-items:center; gap:8px; }
.we-series-head { padding:0 4px 4px; font-size:10px; font-weight:600; color:var(--fg-secondary); text-transform:uppercase; }
.we-series-row { padding:4px 0; }
.we-series-type,.we-series-input { display:flex; align-items:center; gap:8px; width:100%; height:40px; border:1px solid var(--border); border-radius:8px; padding:0 8px; background:color-mix(in srgb,var(--surface-2) 40%,transparent); color:var(--fg); font-size:12px; }
.we-series-type b { display:grid; place-items:center; width:20px; height:20px; background:var(--surface-3); border-radius:4px; font-size:10px; }
.we-series-input { min-width:0; text-align:center; outline:0; }
.we-series-input:focus { border-color:var(--primary); }
.we-series-remove { display:grid; place-items:center; width:28px; height:32px; border:0; border-radius:8px; background:transparent; color:var(--fg-secondary); cursor:pointer; }
.we-series-add { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:8px; padding:10px; border:1px dashed var(--border); border-radius:8px; background:transparent; color:var(--fg-secondary); font-size:14px; cursor:pointer; }
.we-series-add:hover { border-color:var(--primary-40); color:var(--fg); }
.we-detail-load { border:1px solid color-mix(in srgb,var(--border) 60%,transparent); border-radius:16px; overflow:hidden; background:color-mix(in srgb,var(--surface-1) 40%,transparent); }
.we-detail-load-head { display:flex; gap:12px; align-items:center; padding:12px; font-size:14px; }
.we-detail-load-icon { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--surface-3); color:var(--fg-secondary); }
.we-detail-load-value { display:flex; align-items:center; gap:8px; margin:0; padding:12px; border-top:1px solid var(--border); color:var(--fg-secondary); }
.we-detail-load-value input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:var(--fg); font-size:18px; }
.we-legacy-series { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
#weExercise [hidden] { display:none !important; }
@media(max-width:639px) { .we-detail-back span { display:none; } .cx .we-detail-title h3 { font-size:14px; } .we-series-head,.we-series-row { gap:5px; grid-template-columns:16px minmax(82px,1.4fr) minmax(58px,1fr) minmax(60px,.9fr) 24px; } }
@media(prefers-reduced-motion:reduce) { .we-sheet { transition:none; } }

/* Adaptação compartilhada: os conteúdos encolhem, os controles continuam acessíveis. */
.cx-main,.cx-container,.cx-card,.cx-grid > *, .cx-flex1,.pp-row > *,.pp-head > * { min-width:0; }
.cx-grid-2 { grid-template-columns:minmax(0,1fr); }
@media(min-width:640px) { .cx-grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); } .cx-grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)); } }
.cx :is(input,select,textarea) { min-width:0; max-width:100%; }
.cx :is(img,video,iframe) { max-width:100%; }
.cx :is(.cx-title,.sp-name,.pp-info-title,.cx-tile-title,.tp-title) { overflow-wrap:anywhere; }
.cx :is(.cx-card-head,.cx-action,.pp-info) > :not(svg) { min-width:0; }
.cx :is(.cx-action,.pp-info,.cx-tile) .cx-flex { min-width:0; }
.cx :is(.cx-action,.pp-info,.cx-tile) .cx-flex > span:not(.cx-icon):not(.cx-action-icon):not(.pp-info-icon):not(.cx-tile-icon) { min-width:0; }
.cx-mtop { display:grid; grid-template-columns:minmax(0,1fr) auto; }
.cx-mtop > * { min-width:0; }
.cx-mtop .cx-logo-mask { flex-shrink:0; }
.cx .table { display:block; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.cx [style*="height: 650px"] { height:auto !important; max-height:none !important; overflow:visible !important; }
.cx .modal-dialog { width:auto; max-width:min(100% - 24px,560px); margin-right:auto; margin-left:auto; }
.cx .modal-content { max-width:100%; overflow-wrap:anywhere; }
.cx .pagination { flex-wrap:wrap; gap:4px; }
.we-pop { max-width:calc(100vw - 24px); max-height:calc(100dvh - 100px); overflow-y:auto; }
.we-pop[style*="right:0"] { left:auto; }
.we-namebox { min-width:0; }
.we-chip { max-width:100%; }
.we-chips { min-width:0; }
.tp-head-row > *, .tp-aside { min-width:0; }
.tp-ex { height:auto; min-height:72px; }
.tp-ex-name { overflow-wrap:anywhere; }
.tp-ex-text { overflow:visible; }
.tp-grid { grid-template-columns:minmax(0,2fr) minmax(0,1fr); }
.cx-bnav { padding-bottom:calc(8px + env(safe-area-inset-bottom)); }
.cx-main { padding-bottom:calc(96px + env(safe-area-inset-bottom)); }
@media(min-width:768px) { .cx-mtop { display:none; } .cx-main { padding-bottom:32px; } }
@media(max-width:767px) {
 .cx-stickybar,.we-header { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
 .cx-stickybar > *,.we-header > * { min-width:0; }
 .cx-stickybar h1,.we-htitle { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .cx-stickybar .cx-flex,.we-header .cx-flex { min-width:0; }
 .cx-stickybar .cx-back { flex-shrink:0; padding-left:0; }
 .cx-stickybar .cx-back span { display:none; }
 .cx-grid-main { grid-template-columns:minmax(0,1fr); }
 .cx-container { padding-right:16px; padding-left:16px; }
 .cx-card-head { display:grid; grid-template-columns:minmax(0,1fr) auto; }
 .cx-card-head > :only-child { grid-column:1 / -1; }
 .cx-segment { width:100%; max-width:100%; }
 .cx-container > .cx-flex:has(> .cx-segment),.cx-container > .cx-flex:has(> .pp-tabs) { display:grid; grid-template-columns:minmax(0,1fr); justify-items:start; gap:12px; }
 .pp-tabs { max-width:100%; flex-wrap:nowrap; overflow-x:auto; }
 .pp-tabs a { flex-shrink:0; white-space:nowrap; }
 .sp-summary { padding:16px; }
 .sp-tab-body { padding:16px; }
 .sp-identity { display:grid; grid-template-columns:auto minmax(0,1fr); }
 .sp-identity > :last-child:not(.cx-flex1) { grid-column:2; }
 .cx .form-control,.cx .custom-select,.we-input { font-size:16px; }
 .ce-head { padding-left:16px; }
 .ce-fields,.ce-footer { padding-right:16px; padding-left:16px; }
 .tp-alert-foot,.we-picker-foot { flex-wrap:wrap; }
 .tp-alert-foot .tp-pill { flex:1; padding:0 12px; white-space:normal; }
 .we-picker-foot .we-save { margin-left:auto; }
 .we-picker-head { padding-right:12px; padding-left:12px; }
 .we-sessions { min-height:0; }
}
@media(max-width:359px) {
 .cx-stickybar { padding:12px; }
 .cx-btn-glow { padding:8px 12px !important; font-size:12px !important; }
 .we-header { padding:12px; }
 .we-back { font-size:12px; }
 .we-htitle { font-size:12px !important; }
 .we-save { padding:0 12px; }
 #weExercise .we-sheet-body { padding:12px; }
 .we-series-head,.we-series-row { grid-template-columns:14px minmax(70px,1.4fr) minmax(46px,1fr) minmax(52px,.9fr) 24px; gap:4px; }
 .we-series-type { gap:4px; padding:0 5px; }
}
@media(pointer:coarse) { .cx-icon-btn,.we-ibtn { min-width:36px; min-height:36px; } }
.cx .ratio { position:relative; width:100%; aspect-ratio:16/9; }
.cx .ratio > :is(iframe,video) { position:absolute; inset:0; width:100%; height:100%; }
@media(max-width:767px) {
 .cx .d-md-flex { min-width:0; }
 .cx .d-md-flex > [class*="col-md-"] { padding-right:0; padding-left:0; }
 .cx .card > .d-flex:has(> .col-2,> .col-5) { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
 .cx .card > .d-flex:has(> .col-2,> .col-5) > [class*="col-"] { width:auto; max-width:none; padding:8px !important; }
 .cx .card > .d-flex:has(> .col-2,> .col-5) :is(h6,.font-size-18,.font-size-20) { white-space:normal !important; overflow-wrap:anywhere; }
 .pp-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; overflow:visible; }
 .pp-tabs a { padding:6px 8px; text-align:center; font-size:12px; }
}

/* Exact reference scale: Tailwind theme radii, responsive Input/Textarea sizes.
   The Cactus input components retain md:text-sm even when text-xl is supplied. */
.we, .we-sheet, .we-picker { font-family:var(--font-body); line-height:1.5; letter-spacing:0; }
.we :is(button,input,select,textarea), .we-sheet :is(button,input,select,textarea), .we-picker :is(button,input,select,textarea) { font-family:var(--font-body); line-height:1.5; letter-spacing:0; }
.we-namebox { border-radius:var(--we-radius-lg); margin:0; }
.we-namebox input { display:block; font-size:20px; line-height:28px; border-radius:var(--we-radius-md); }
.we-desc { font-size:16px; line-height:24px; border-radius:var(--we-radius-md); }
.we-scard { border-radius:var(--we-radius-xl); }
.we-scard-head { border-radius:calc(var(--we-radius-xl) - 1px) calc(var(--we-radius-xl) - 1px) 0 0; }
.we-block, .we-exrow, .we-block .we-addex { border-radius:var(--we-radius-lg); }
.we-addex, .we-pick { border-radius:var(--we-radius-xl); }
.we-letter, .we-play, .we-detail-back, .we-detail-trash, .we-input, .we-search input, .we-filter { border-radius:var(--we-radius-md); }
.we-ibtn { border-radius:var(--we-radius-md); }
.we-exname { line-height:1.375; }
.we-exmeta { line-height:15px; }
.we-chip, .we-save, .we-outline, .we-round, .we-addsess, .we-preset { border-radius:var(--we-radius-full); }
.we-detail-media { border-radius:var(--we-radius-xl); }
.we-detail-load { border-radius:var(--we-radius-2xl); }
.we-detail-load-head strong { font-weight:600; }
.we-series-scroll { overflow-x:auto; margin:0 -4px; padding:0 4px; }
.we-series-head, .we-series-row { grid-template-columns:20px 150px 100px 90px 32px; gap:8px; min-width:424px; }
.we-series-type { border-radius:var(--we-radius-lg); font-size:14px; }
.we-series-type b { border-radius:var(--we-radius-sm); }
.we-series-input { border-radius:var(--we-radius-full); font-size:14px; font-weight:600; background:var(--surface-3); }
.we-series-remove { border-radius:var(--we-radius-lg); width:32px; }
.we-series-add { border-radius:var(--we-radius-lg); font-weight:500; }
.we-detail-back { font-weight:500; }
.we .we-back { font-size:14px; }
.cx .we-htitle { font-size:14px !important; line-height:20px; letter-spacing:0; }
.cx .modal-content.we-picker { border-radius:var(--we-radius-lg) !important; }
.we-picker :is(h4,.we-exname) { line-height:1.5; }
.we-sheet .cx-xs { line-height:1.375; }
@media(min-width:768px) {
 .we-namebox input, .we-desc { font-size:14px; line-height:20px; }
 .we-input { font-size:14px; line-height:20px; }
 .cx .we-htitle { font-size:16px !important; line-height:24px; }
}

/* ==== Exercícios (ex-*) — referência Cactus Fitness ==== */
.ex-wrap { max-width: 896px; }
.ex-title { margin: 0; font-size: 20px; font-weight: 700; }
@media (min-width: 768px) { .ex-title { font-size: 24px; } }
.ex-note { display: flex; align-items: center; gap: 10px; border: 1px solid rgba(234,179,8,.2); background: rgba(234,179,8,.1); border-radius: 12px; padding: 10px 12px; margin-bottom: 16px; color: #eab308; font-size: 12px; }
.ex-note svg { flex-shrink: 0; }
.ex-search { margin-bottom: 12px; }
.ex-clear { border: 0; background: none; color: var(--fg-secondary); font-size: 12px; cursor: pointer; font-family: var(--font-body); }
.ex-clear:hover { color: var(--fg); }
.ex-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.ex-tabs button { border: 0; background: transparent; border-radius: 9999px; padding: 6px 14px; font-size: 14px; color: var(--fg-secondary); cursor: pointer; font-family: var(--font-body); }
.ex-tabs button.active { background: var(--primary-15); color: var(--primary); }
.ex-filter { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); background: var(--surface-1); border-radius: 9999px; padding: 6px 14px; font-size: 12px; font-weight: 600; color: var(--fg-secondary); cursor: pointer; font-family: var(--font-body); }
.ex-filter:hover { color: var(--fg); }
.ex-filter.on { border-color: var(--primary-40); background: var(--primary-15); color: var(--primary); }
.ex-filter-count { display: inline-grid; place-items: center; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 9999px; background: var(--primary-15); color: var(--primary); font-size: 10px; }
.ex-filterbox { margin-bottom: 16px; }
.ex-filter-label { margin: 0 0 6px; font-size: 10px; text-transform: uppercase; letter-spacing: .06em; font-weight: 600; color: var(--fg-secondary); }
.ex-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ex-chips button { border: 1px solid var(--border); background: var(--surface-1); color: var(--fg-secondary); border-radius: 9999px; padding: 6px 12px; font-size: 12px; cursor: pointer; font-family: var(--font-body); }
.ex-chips button:hover { color: var(--fg); }
.ex-chips button.active { border-color: var(--primary-40); background: var(--primary-15); color: var(--primary); }
.ex-count { font-size: 12px; color: var(--fg-secondary); margin-bottom: 10px; }
.ex-list { display: flex; flex-direction: column; gap: 12px; padding-bottom: 6px; }
.ex-row { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; background: var(--surface-1); border: 1px solid var(--border); border-radius: 24px; padding: 12px; cursor: pointer; color: var(--fg); font-family: var(--font-body); transition: border-color .15s, background .15s; }
.ex-row:hover { border-color: var(--primary-40); background: var(--surface-2); }
.ex-thumb { position: relative; width: 48px; height: 48px; border-radius: 16px; overflow: hidden; flex-shrink: 0; display: grid; place-items: center; background: var(--surface-3); }
.ex-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ex-play { position: relative; width: 20px; height: 20px; border-radius: 9999px; background: var(--primary); display: grid; place-items: center; color: var(--primary-fg); }
.ex-body { min-width: 0; flex: 1; }
.ex-name { display: block; font-size: 14px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ex-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px; }
.ex-chip { display: inline-flex; border-radius: 9999px; padding: 2px 10px; font-size: 11px; font-weight: 600; color: var(--fg-secondary); background: var(--surface-3); }
.ex-chip-accent { color: var(--primary); background: var(--primary-15); }
.ex-chip-plain { display: inline-flex; border-radius: 9999px; padding: 2px 8px; font-size: 10px; font-weight: 600; color: var(--fg-secondary); background: var(--surface-3); }
.ex-badge-mine { display: inline-flex; border-radius: 9999px; padding: 2px 8px; font-size: 10px; font-weight: 600; color: var(--primary); background: var(--primary-15); }
.ex-more { display: flex; align-items: center; gap: 6px; margin: 12px auto 0; border: 1px solid var(--border); background: var(--surface-1); color: var(--fg-secondary); border-radius: 9999px; padding: 8px 16px; font-size: 12px; font-weight: 600; cursor: pointer; font-family: var(--font-body); }
.ex-more:hover { color: var(--fg); }
.ex-empty { border: 1px dashed var(--border); border-radius: 24px; padding: 32px; text-align: center; font-size: 14px; color: var(--fg-secondary); }

/* Modais (visualizar e assistente) */
.ex-overlay { position: fixed; inset: 0; z-index: 2000; display: flex; align-items: flex-end; justify-content: center; background: rgba(0,0,0,.7); backdrop-filter: blur(4px); padding: 0; }
@media (min-width: 768px) { .ex-overlay { align-items: center; padding: 16px; } }
.ex-sheet { width: 100%; max-width: 560px; max-height: 92vh; background: var(--surface-1); border: 1px solid var(--border); border-radius: 28px 28px 0 0; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0,0,0,.6); }
.ex-sheet.wide { max-width: 672px; }
@media (min-width: 768px) { .ex-sheet { border-radius: 28px; } }
.ex-hero { position: relative; aspect-ratio: 16 / 9; width: 100%; background: #000; flex-shrink: 0; }
.ex-hero iframe, .ex-hero video { width: 100%; height: 100%; display: block; border: 0; }
.ex-hero img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ex-hero-ph { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 8px; color: var(--fg-secondary); }
.ex-hero-ph p { margin: 0; font-size: 12px; }
.ex-close { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border-radius: 9999px; border: 0; background: rgba(0,0,0,.6); color: #fff; display: grid; place-items: center; cursor: pointer; z-index: 2; }
.ex-close:hover { background: rgba(0,0,0,.8); }
.ex-head { padding: 16px 20px 12px; border-bottom: 1px solid var(--border); }
.ex-head h2 { margin: 6px 0 0; font-size: 20px; font-weight: 700; line-height: 1.2; }
.ex-bodytext { padding: 16px 20px; overflow-y: auto; flex: 1; }
.ex-howto { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.ex-howto svg { color: var(--primary); }
.ex-howto h3 { margin: 0; font-size: 14px; font-weight: 600; }
.ex-desc { margin: 0; font-size: 14px; color: var(--fg-secondary); white-space: pre-wrap; line-height: 1.6; }
.ex-desc-ph { margin: 0; font-size: 14px; color: var(--fg-secondary); font-style: italic; }
.ex-foot { padding: 12px 20px; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; gap: 8px; }
.ex-ghost { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); background: var(--surface-2); color: var(--fg-secondary); border-radius: 9999px; padding: 10px 16px; font-size: 12px; font-weight: 600; cursor: pointer; font-family: var(--font-body); }
.ex-ghost:hover { color: var(--fg); }
.ex-ghost[disabled] { opacity: .4; cursor: not-allowed; }
.ex-cta { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 0; background: var(--primary); color: var(--primary-fg); border-radius: 9999px; padding: 10px 16px; font-size: 12px; font-weight: 700; cursor: pointer; box-shadow: 0 0 20px rgba(76,175,80,.35); font-family: var(--font-body); }
.ex-cta:hover { filter: brightness(1.1); }
.ex-cta[disabled] { opacity: .4; cursor: not-allowed; }

/* Assistente */
.ex-wizhead { padding: 16px 20px; border-bottom: 1px solid var(--border); display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ex-kicker { margin: 0; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; font-weight: 600; color: var(--fg-secondary); }
.ex-wizhead h2 { margin: 2px 0 0; font-size: 22px; font-weight: 700; }
.ex-x { width: 36px; height: 36px; border-radius: 9999px; border: 0; background: var(--surface-3); color: var(--fg); display: grid; place-items: center; cursor: pointer; flex-shrink: 0; }
.ex-x:hover { background: var(--surface-2); }
.ex-steps { display: flex; gap: 8px; padding: 16px 20px 0; }
.ex-steps button { height: 6px; flex: 1; border: 0; border-radius: 9999px; background: var(--surface-3); cursor: pointer; padding: 0; }
.ex-steps button.active { background: var(--primary); }
.ex-steps button.done { background: var(--primary); opacity: .6; }
.ex-wizbody { padding: 20px; overflow-y: auto; flex: 1; }
.ex-field { margin-bottom: 20px; }
.ex-field label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 6px; }
.ex-field .hint { font-size: 12px; color: var(--fg-secondary); font-weight: 400; }
.ex-input, .ex-select, .ex-textarea { width: 100%; border: 1px solid var(--border); background: var(--surface-2); color: var(--fg); border-radius: 16px; padding: 10px 12px; font-size: 14px; font-family: var(--font-body); outline: none; }
.ex-input:focus, .ex-select:focus, .ex-textarea:focus { border-color: var(--primary); }
.ex-input::placeholder, .ex-textarea::placeholder { color: var(--fg-secondary); }
.ex-select { appearance: auto; }
.ex-textarea { resize: vertical; min-height: 120px; line-height: 1.5; }
.ex-strong { color: var(--fg); }
.ex-notebox { display: flex; gap: 10px; border: 1px solid var(--primary-40); background: var(--primary-15); border-radius: 16px; padding: 12px; font-size: 12px; margin-bottom: 20px; line-height: 1.5; }
.ex-notebox p { margin: 0 0 2px; }
.ex-notebox p:last-child { margin-bottom: 0; }
.ex-notebox-title { font-weight: 600; color: var(--primary); }
.ex-notebox svg { flex-shrink: 0; margin-top: 2px; color: var(--primary); }
.ex-mediahint { margin: 0 0 12px; font-size: 12px; color: var(--fg-secondary); }
.ex-media-tabs { display: inline-flex; gap: 2px; border: 1px solid var(--border); background: var(--surface-2); border-radius: 12px; padding: 4px; margin-bottom: 12px; }
.ex-media-tabs button { border: 0; background: transparent; border-radius: 8px; padding: 6px 12px; font-size: 12px; font-weight: 600; color: var(--fg-secondary); cursor: pointer; font-family: var(--font-body); }
.ex-media-tabs button.active { background: var(--primary); color: var(--primary-fg); }
.ex-upload { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; border: 2px dashed var(--border); border-radius: 16px; background: var(--surface-2); padding: 24px; cursor: pointer; font-size: 14px; font-weight: 500; text-align: center; }
.ex-upload:hover { background: var(--surface-3); }
.ex-upload svg { color: var(--fg-secondary); }
.ex-preview { margin-top: 12px; width: 100%; max-height: 288px; border-radius: 16px; background: #000; object-fit: contain; }
.ex-url-preview { margin-top: 12px; aspect-ratio: 16 / 9; width: 100%; border-radius: 16px; overflow: hidden; background: #000; }
.ex-url-preview iframe { width: 100%; height: 100%; border: 0; }
.ex-error { border-radius: 12px; background: rgba(239,68,68,.1); border: 1px solid rgba(239,68,68,.3); color: var(--destructive); padding: 8px 12px; font-size: 12px; margin-top: 8px; }
.ex-wizfoot { padding: 16px 20px; border-top: 1px solid var(--border); display: flex; gap: 12px; }
.ex-wizfoot .ex-cta { flex: 1; }
@media (max-width: 640px) {
  .ex-sheet { max-height: 94vh; }
  .ex-name { white-space: normal; }
}

/* ---------- Rotinas de Treino (rt-*) ---------- */
.rt-pills { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.rt-pill { border-radius: 9999px; border: 1px solid var(--border); background: var(--surface-1); color: var(--fg-secondary) !important; padding: 7px 16px; font-size: 13px; text-decoration: none !important; transition: all .15s; }
.rt-pill:hover { color: var(--fg) !important; }
.rt-pill.active { border-color: var(--primary); background: var(--primary-10); color: var(--primary) !important; }
.rt-dates { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; }
.rt-dates input[type="date"] { height: 36px; border-radius: 10px; border: 1px solid var(--border); background: var(--surface-1); color: var(--fg); padding: 0 12px; font-size: 13px; font-family: inherit; outline: none; color-scheme: dark; }
.rt-dates input[type="date"]:focus { border-color: var(--primary); }
.rt-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 16px; }
.rt-total { display: flex; align-items: baseline; gap: 8px; font-size: 13px; }
.rt-total strong { font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; }
.rt-list-head { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; padding: 12px 16px; border-bottom: 1px solid var(--border); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--fg-muted); }
.rt-list { list-style: none; margin: 0; padding: 0; }
.rt-list li + li { border-top: 1px solid var(--border); }
.rt-row { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 16px; width: 100%; padding: 12px 16px; background: none; border: 0; color: inherit; font-family: inherit; text-align: left; cursor: pointer; transition: background .15s; }
.rt-row:hover { background: var(--surface-2); }
.rt-name { font-size: 14px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rt-count { border-radius: 9999px; background: var(--primary-10); color: var(--primary); padding: 4px 12px; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.rt-overlay { position: fixed; inset: 0; z-index: 1060; display: flex; align-items: flex-end; justify-content: center; background: rgba(0,0,0,.6); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.rt-overlay[hidden] { display: none; }
.rt-modal { width: 100%; max-width: 512px; max-height: 85vh; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--border); border-bottom: 0; border-radius: 16px 16px 0 0; background: var(--surface-1); box-shadow: 0 24px 48px rgba(0,0,0,.5); }
.rt-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px; border-bottom: 1px solid var(--border); }
.rt-modal-list { list-style: none; margin: 0; padding: 0; overflow-y: auto; }
.rt-session { padding: 16px; }
.rt-session + .rt-session { border-top: 1px solid var(--border); }
.rt-session-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.rt-done { display: inline-flex; align-items: center; gap: 4px; flex-shrink: 0; border-radius: 9999px; background: var(--primary-10); color: var(--primary); padding: 4px 10px; font-size: 11px; font-weight: 500; }
.rt-session-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 8px; font-size: 11px; color: var(--fg-secondary); }
@media (min-width: 640px) {
    .rt-overlay { align-items: center; padding: 16px; }
    .rt-modal { border-bottom: 1px solid var(--border); border-radius: 16px; }
    .rt-modal-list { max-height: 70vh; }
}