:root {
  --bg: #efebe4;
  --panel: #f6f3ee;
  --card: #ffffff;
  --card-2: #e9e4db;
  --border: #ddd6ca;
  --border-2: #c8bfb1;
  --text: #161412;
  --muted: #6f685e;
  --accent: #1c1a17;
  --accent-soft: #e6e0d6;
  --danger: #c23a47;
  --warn: #a8701a;
  --ok: #1f9d63;
  --radius: 12px;
  --ink: #0f0e0c;
  --bone: #ece6dc;
  --stone: #8e877d;
  --f-display: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 14px/1.45 Jost, "Century Gothic", system-ui, sans-serif;
}
button { font: inherit; color: inherit; }
h1, h2, h3, h4 { margin: 0; }

input, select, textarea {
  font: inherit; color: var(--text);
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 11px;
  outline: none;
  min-width: 0;
}
input:focus, select:focus, textarea:focus { border-color: var(--accent); }
textarea { width: 100%; resize: vertical; }
input[type=checkbox] { accent-color: var(--accent); width: 16px; height: 16px; margin: 0; padding: 0; cursor: pointer; flex: none; }

.muted { color: var(--muted); }
.sm { font-size: 12.5px; }
.grow { flex: 1; min-width: 0; }
.break { word-break: break-all; }
.error { color: var(--danger); font-weight: 600; }
[hidden] { display: none !important; }

/* ---------- Botones ---------- */
.btn {
  font-weight: 600;
  border: 1px solid var(--border);
  background: var(--card); color: var(--text);
  padding: 8px 15px; border-radius: 10px; cursor: pointer;
  white-space: nowrap;
}
.btn:hover { filter: brightness(.96); }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn.danger { color: var(--danger); border-color: #f2cdd1; background: transparent; }
.btn.danger-solid { background: var(--danger); border-color: var(--danger); color: #fff; }
.btn.ghost { background: transparent; border-color: transparent; }
.btn.sm { padding: 5px 10px; font-size: 12.5px; border-radius: 8px; }
a.btn { text-decoration: none; display: inline-flex; align-items: center; justify-content: center; }

.icon-btn {
  background: none; border: none; color: var(--muted); cursor: pointer;
  padding: 5px 7px; border-radius: 7px; line-height: 1; font-size: 14px;
}
.icon-btn:hover:not(:disabled) { color: var(--text); background: var(--card-2); }
.icon-btn:disabled { opacity: .3; cursor: default; }
.icon-btn.close:hover:not(:disabled) { color: var(--danger); }

.pill {
  display: inline-block; min-width: 18px; padding: 0 6px; border-radius: 99px;
  background: var(--danger); color: #fff; font-size: 11px; line-height: 18px; text-align: center;
}

/* ---------- Barra superior ---------- */
.topbar {
  display: flex; justify-content: space-between; align-items: center;
  gap: 16px; flex-wrap: wrap;
  padding: 20px 32px;
  border-bottom: 1px solid var(--border);
}
.brand { display: flex; align-items: center; gap: 14px; }
.brand-mark {
  width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center;
  background: var(--accent); color: #fff; font-weight: 700; font-size: 20px;
}
h1 { font-size: 20px; }
.subtitle { margin: 2px 0 0; color: var(--muted); }
.actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }

.project-top {
  position: sticky; top: 0; z-index: 20;
  background: rgba(239, 235, 228, .92);
  backdrop-filter: blur(10px);
  padding-top: 14px; padding-bottom: 14px;
}
.pt-left { display: flex; align-items: center; gap: 8px; flex: 1 1 auto; max-width: 100%; }
.back { font-size: 18px; padding: 4px 10px; }
.dot { width: 12px; height: 12px; border-radius: 50%; flex: none; }
.title-input {
  flex: 0 1 auto; field-sizing: content; min-width: 8ch; max-width: 100%;
  font-size: 20px; font-weight: 700;
  background: transparent; border-color: transparent; padding: 5px 8px;
}
.title-input:hover { border-color: var(--border); }
.more { font-size: 20px; padding: 4px 9px; }

/* ---------- Tablero ---------- */
.board { padding: 28px 32px 60px; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 18px; }

.card {
  position: relative;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px;
  min-height: 160px;
  cursor: pointer;
  display: flex; flex-direction: column; justify-content: space-between;
  transition: transform .15s, background .15s, border-color .15s;
  overflow: hidden;
  outline: none;
}
.card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--c, var(--accent));
}
.card:hover, .card:focus-visible { transform: translateY(-3px); background: #fffdf8; border-color: var(--c, var(--accent)); }
.card h2 { margin: 0 0 6px; font-size: 17px; line-height: 1.3; }
.card .meta { color: var(--muted); font-size: 12.5px; margin-bottom: 8px; }
.card .foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 16px; }
.foot-left { display: flex; align-items: center; gap: 8px; }
.mod-icons { display: flex; gap: 4px; font-size: 13px; opacity: .85; }

.badge {
  display: inline-block;
  font-size: 11.5px; font-weight: 600;
  padding: 3px 9px; border-radius: 999px;
  background: #ebe3d5; color: var(--muted);
}
.badge.warn { background: #f7ebcc; color: var(--warn); }
.badge.s-en-curso { background: #dce5fa; color: #2c58bd; }
.badge.s-en-pausa { background: #f4e3bf; color: var(--warn); }
.badge.s-completado { background: #d6f1e3; color: #18784b; }

.progress { width: 80px; height: 6px; background: #ebe3d5; border-radius: 4px; overflow: hidden; flex: none; }
.progress > span { display: block; height: 100%; background: var(--c, var(--accent)); transition: width .3s; }
.progress.big { width: 180px; height: 8px; }
.progress.big > span { background: var(--ok); }

.card.add {
  border-style: dashed; background: transparent;
  align-items: center; justify-content: center; color: var(--muted); font-weight: 600;
}
.card.add::before { display: none; }
.card.add .plus { font-size: 30px; line-height: 1; margin-bottom: 6px; }

/* ---------- Vista de proyecto ---------- */
.project-main { max-width: 1280px; margin: 0 auto; padding: 24px 32px 80px; display: flex; flex-direction: column; gap: 18px; }

.block, .module {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.modules { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; align-items: start; }
.module.wide { grid-column: 1 / -1; }
.module { min-width: 0; animation: pop .2s ease; }
@keyframes pop { from { opacity: 0; transform: translateY(6px); } }

.module-head {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px 10px 16px;
  border-bottom: 1px solid var(--border);
  cursor: default;
}
.module.collapsed .module-head, .diag-sum.collapsed .module-head { border-bottom: none; }
.module.collapsed .module-body, .diag-sum.collapsed .diag-body { display: none; }
.module-icon { font-size: 16px; width: 22px; text-align: center; flex: none; }
.module-title, .module-name {
  font-size: 15px; font-weight: 700;
  background: transparent; border-color: transparent; padding: 4px 6px;
  flex: 0 1 auto; min-width: 6ch; max-width: 100%; field-sizing: content;
}
.module-name { width: auto; }
.module-title:hover { border-color: var(--border); }
.module-count { color: var(--muted); font-size: 12.5px; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.module-tools { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.module-body { padding: 16px; }

.empty-state {
  grid-column: 1 / -1;
  border: 1px dashed var(--border-2); border-radius: var(--radius);
  padding: 36px; text-align: center; color: var(--muted);
}
.empty-sm { color: var(--muted); padding: 18px; text-align: center; list-style: none; grid-column: 1 / -1; }

/* ---------- Diagnóstico ---------- */
.diag-form { padding: 26px 28px; display: flex; flex-direction: column; gap: 22px; border-color: var(--accent); }
.diag-intro h2 { font-size: 22px; margin: 4px 0 6px; }
.diag-intro p { margin: 0; max-width: 640px; }
.eyebrow { color: var(--accent); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
fieldset { border: none; margin: 0; padding: 0; }
legend { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 600; margin-bottom: 12px; padding: 0; }
.form-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.form-grid label, .tk-grid label, .tk-detail > label, .vw-side label {
  display: flex; flex-direction: column; gap: 6px; color: var(--muted); font-size: 12.5px;
}
.form-grid .full, .tk-grid .full { grid-column: 1 / -1; }
.questions { display: flex; flex-direction: column; gap: 10px; }
.q {
  display: flex; align-items: center; gap: 14px;
  background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px;
}
.q-icon { font-size: 20px; width: 28px; text-align: center; flex: none; }
.q-text { flex: 1; min-width: 0; }
.tag { background: var(--accent-soft); color: #3d3830; border-radius: 5px; padding: 1px 6px; font-size: 11px; font-weight: 600; }
.seg { display: inline-flex; background: var(--bg); border: 1px solid var(--border); border-radius: 9px; padding: 3px; flex: none; }
.seg input { display: none; }
.seg span { display: block; padding: 5px 16px; border-radius: 7px; cursor: pointer; color: var(--muted); font-weight: 600; }
.seg input:checked + span { background: var(--accent); color: #fff; }
.seg label:last-child input:checked + span { background: var(--card-2); color: var(--text); }
.diag-foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding-top: 6px; border-top: 1px solid var(--border); padding-top: 18px; }
.diag-btns { display: flex; gap: 10px; margin-left: auto; }

.diag-body { padding: 16px 20px 18px; }
.diag-obj { margin: 0 0 14px; font-size: 15px; max-width: 900px; }
.kv { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; margin: 0; }
.kv dt { color: var(--muted); font-size: 12px; }
.kv dd { margin: 2px 0 0; font-weight: 600; }
.diag-risks { margin-top: 14px; padding: 10px 12px; background: #f9eed3; border-radius: 10px; color: #6f4d0f; }
.countdown { font-size: 12px; font-weight: 600; color: var(--muted); background: var(--panel); padding: 3px 9px; border-radius: 99px; white-space: nowrap; }
.countdown.soon { color: var(--warn); }
.countdown.late { color: var(--danger); }

/* ---------- Chips / filtros ---------- */
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip-btn {
  background: var(--panel); border: 1px solid var(--border); border-radius: 99px;
  padding: 4px 11px; font-size: 12.5px; cursor: pointer; color: var(--muted);
}
.chip-btn span { opacity: .7; margin-left: 2px; }
.chip-btn.on { background: var(--accent-soft); border-color: var(--accent); color: var(--text); }
.sm-select { padding: 5px 9px; font-size: 12.5px; border-radius: 8px; }

/* ---------- Tareas ---------- */
.st-pendiente { --st: #8a93a6; }
.st-en-progreso { --st: #1c1a17; }
.st-en-revision { --st: #7a4ddf; }
.st-bloqueada { --st: #ff5f6d; }
.st-hecha { --st: #1f9d63; }

.tk-add { display: flex; gap: 8px; margin-bottom: 14px; }
.tk-add input[name=title] { flex: 1; }
.tk-stats { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; color: var(--muted); font-size: 12.5px; flex-wrap: wrap; }
.tk-bar { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }

.tk-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
li.tk {
  background: var(--panel); border: 1px solid var(--border); border-left: 3px solid var(--st);
  border-radius: 10px; transition: box-shadow .3s;
}
li.tk.flash { box-shadow: 0 0 0 2px var(--accent); }
.tk-row { display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 12px; }
.tk-title {
  flex: 1; min-width: 0; text-align: left; background: none; border: none; cursor: pointer;
  padding: 5px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 500;
}
li.tk.st-hecha .tk-title { text-decoration: line-through; color: var(--muted); }
.tk-meta { display: flex; align-items: center; gap: 8px; flex: none; }
.tk-tag { font-size: 12px; color: var(--muted); }
.avatar {
  width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center;
  background: var(--accent-soft); color: #3d3830; font-size: 10px; font-weight: 700;
}
.prio { font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 5px; background: #ebe3d5; color: var(--muted); }
.prio-alta { color: #c25f0a; background: #fbe4cd; }
.prio-urgente { color: #fff; background: var(--danger); }
.due { font-size: 12px; color: var(--muted); white-space: nowrap; }
.due.late { color: var(--danger); font-weight: 600; }
.status-pill {
  appearance: none; -webkit-appearance: none;
  border: none; cursor: pointer;
  background: color-mix(in srgb, var(--st) 18%, transparent); color: var(--st);
  font-weight: 600; font-size: 12px; padding: 4px 10px; border-radius: 99px;
}
.status-pill option { background: var(--panel); color: var(--text); }

.tk-detail { border-top: 1px solid var(--border); padding: 14px; display: flex; flex-direction: column; gap: 14px; }
.tk-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.tk-check .lbl, .lbl { font-size: 12.5px; color: var(--muted); margin-bottom: 6px; }
.tk-check ul { list-style: none; margin: 0 0 6px; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.tk-check li { display: flex; align-items: center; gap: 10px; padding: 3px 4px 3px 8px; border-radius: 8px; }
.tk-check li:hover { background: var(--card); }
.tk-check li span { flex: 1; }
.tk-check li.done span { text-decoration: line-through; color: var(--muted); }
.tk-check-add input { width: 100%; background: transparent; border-style: dashed; }
.tk-foot { display: flex; justify-content: space-between; align-items: center; }

/* ---------- Calendario ---------- */
.cal-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.cal-nav { display: flex; align-items: center; gap: 6px; }
.cal-nav h4 { font-size: 16px; min-width: 150px; text-align: center; }
.cal-nav .icon-btn { font-size: 20px; padding: 2px 9px; }
.cal-opts { display: flex; align-items: center; gap: 14px; }
.switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 12.5px; color: var(--muted); }
.switch input { display: none; }
.switch .track { width: 32px; height: 18px; background: var(--border-2); border-radius: 99px; position: relative; transition: .15s; }
.switch .track::after { content: ""; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: .15s; }
.switch input:checked + .track { background: var(--accent); }
.switch input:checked + .track::after { left: 16px; }
.switch.disabled { opacity: .45; cursor: not-allowed; }

.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.cal-dow { padding: 6px 8px; font-size: 11px; color: var(--muted); background: var(--panel); text-transform: uppercase; letter-spacing: .05em; border-bottom: 1px solid var(--border); }
.cal-cell {
  min-height: 96px; padding: 5px; min-width: 0;
  border-right: 1px solid var(--border); border-bottom: 1px solid var(--border);
  display: flex; flex-direction: column; gap: 3px; cursor: pointer;
}
.cal-cell:nth-child(7n) { border-right: none; }
.cal-cell:hover { background: #f8f2e8; }
.cal-cell.other { background: #ede5d7; }
.cal-cell.other .cal-num { opacity: .4; }
.cal-num { font-size: 12px; font-weight: 600; color: var(--muted); width: 22px; height: 22px; display: grid; place-items: center; border-radius: 99px; }
.cal-cell.today .cal-num { background: var(--accent); color: #fff; }
.chip {
  font-size: 11.5px; padding: 2px 6px; border-radius: 5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: none;
}
.chip.ev { background: var(--accent-soft); color: #3d3830; }
.chip.tk { background: #ebe3d5; border-left: 3px solid var(--st); }
.chip.tk.done { text-decoration: line-through; opacity: .55; }
.more { font-size: 11px; color: var(--muted); padding-left: 4px; }
.cal-upcoming { margin-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.up-item { display: flex; align-items: center; gap: 10px; cursor: pointer; min-width: 0; }
.up-item .chip { min-width: 0; flex: 0 1 auto; }
.up-date { font-size: 12px; color: var(--muted); width: 90px; flex: none; }

.day-list { list-style: none; margin: 4px 0 18px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.day-list li { display: flex; align-items: center; gap: 10px; }
.day-form { display: flex; flex-direction: column; gap: 8px; padding: 14px; background: var(--card); border-radius: 12px; margin-bottom: 12px; }
.day-form .row { display: flex; gap: 8px; }
.day-form .row input[name=title] { flex: 1; }
.day-form .btn { align-self: flex-start; }

/* ---------- Recursos ---------- */
.rs-drop {
  border: 1.5px dashed var(--border-2); border-radius: 12px; padding: 22px;
  text-align: center; cursor: pointer; margin-bottom: 14px; transition: .15s; outline: none;
}
.rs-drop:hover, .rs-drop:focus-visible, .rs-drop.over { border-color: var(--accent); background: var(--accent-soft); }
.rs-drop-icon { font-size: 22px; margin-bottom: 4px; }
.rs-progress { margin: -6px 0 12px; }
.rs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.rs-item {
  background: var(--panel); border: 1px solid var(--border); border-radius: 12px;
  padding: 0; cursor: pointer; text-align: left; overflow: hidden; transition: border-color .15s, transform .15s;
}
.rs-item:hover { border-color: var(--accent); transform: translateY(-2px); }
.rs-thumb {
  position: relative; aspect-ratio: 4 / 3; background: #e7dfd1;
  display: grid; place-items: center; overflow: hidden;
}
.rs-thumb img, .rs-thumb video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rs-thumb.has-media .rs-icon { display: none; }
.rs-icon { font-size: 30px; }
.rs-icon.big { font-size: 54px; }
.rs-ext { position: absolute; bottom: 8px; right: 8px; font-size: 10.5px; font-weight: 700; background: var(--card-2); padding: 2px 6px; border-radius: 4px; color: var(--muted); }
.rs-play {
  position: absolute; width: 36px; height: 36px; border-radius: 50%;
  background: rgba(60, 45, 20, .35); color: #fff; display: grid; place-items: center; font-size: 13px; padding-left: 2px;
}
.rs-info { padding: 8px 10px 10px; }
.rs-name { font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rs-meta { font-size: 11.5px; color: var(--muted); margin-top: 2px; }

/* ---------- Modales ---------- */
.modal-backdrop {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(60, 45, 20, .35);
  display: grid; place-items: center; padding: 16px;
  animation: fade .15s ease;
}
@keyframes fade { from { opacity: 0; } }
.modal {
  background: var(--panel); border: 1px solid var(--border); border-radius: 16px;
  padding: 22px; width: min(540px, 100%); max-height: calc(100vh - 32px); overflow: auto;
  box-shadow: 0 20px 60px rgba(60, 45, 20, .28);
}
.modal.small { width: min(430px, 100%); }
.modal h3 { font-size: 18px; margin-bottom: 8px; }
.modal-text { color: var(--muted); margin: 0 0 20px; }
.modal-text b { color: var(--text); }
.modal-actions { display: flex; justify-content: flex-end; gap: 10px; }
.modal-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; }
.modal-head h3 { margin: 0; }
.new-form { display: flex; flex-direction: column; gap: 12px; }
.new-form p { margin: 0; }

.trash-list { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.trash-list li { display: flex; align-items: center; gap: 10px; background: var(--card); border-radius: 10px; padding: 10px 12px; }

.modal.viewer {
  width: min(1180px, 100%); height: min(760px, calc(100vh - 32px));
  padding: 0; display: grid; grid-template-columns: minmax(0, 1fr) 300px; overflow: hidden;
}
.vw-stage { position: relative; background: #000; display: grid; place-items: center; min-height: 0; }
.vw-media { width: 100%; height: 100%; display: grid; place-items: center; min-height: 0; }
.vw-media img, .vw-media video { max-width: 100%; max-height: 100%; object-fit: contain; }
.vw-media iframe { width: 100%; height: 100%; border: none; background: #fff; }
.vw-file { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 24px; text-align: center; color: var(--text); }
.vw-nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 42px; height: 42px; border-radius: 50%; border: none; cursor: pointer;
  background: rgba(255, 255, 255, .12); color: #fff; font-size: 24px; line-height: 1;
}
.vw-nav:hover { background: rgba(255, 255, 255, .25); }
.vw-nav.prev { left: 12px; }
.vw-nav.next { right: 12px; }
.vw-side { padding: 18px; display: flex; flex-direction: column; gap: 14px; border-left: 1px solid var(--border); overflow: auto; }
.vw-side .modal-head { margin: 0; }
.vw-actions { display: flex; gap: 8px; margin-top: auto; }
.vw-actions .btn { flex: 1; }

/* ---------- Avisos ---------- */
#toast-root {
  position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%);
  z-index: 200; display: flex; flex-direction: column; gap: 8px; align-items: center;
  width: max-content; max-width: calc(100vw - 32px);
}
.toast {
  display: flex; align-items: center; gap: 12px;
  background: #2b2620; color: #faf6ee;
  padding: 10px 10px 10px 16px; border-radius: 12px;
  box-shadow: 0 10px 30px rgba(60, 45, 20, .22);
  animation: up .2s ease; transition: opacity .2s, transform .2s;
}
.toast.out { opacity: 0; transform: translateY(6px); }
@keyframes up { from { opacity: 0; transform: translateY(10px); } }
.toast-undo { background: none; border: none; color: #3355dd; font-weight: 700; cursor: pointer; padding: 4px 8px; border-radius: 6px; }
.toast-undo:hover { background: rgba(28, 26, 23, .07); }
.toast-x { background: none; border: none; cursor: pointer; color: #b9ad99; padding: 4px 6px; }

/* ---------- Menú ---------- */
.menu {
  position: absolute; z-index: 150; width: 300px;
  background: var(--panel); border: 1px solid var(--border-2); border-radius: 12px;
  padding: 6px; box-shadow: 0 16px 40px rgba(60, 45, 20, .28);
  animation: fade .1s ease;
}
.menu-item {
  display: flex; gap: 10px; width: 100%; text-align: left; align-items: flex-start;
  background: none; border: none; cursor: pointer; padding: 9px 10px; border-radius: 8px;
}
.menu-item:hover { background: var(--card-2); }
.menu-item.danger { color: var(--danger); }
.mi-icon { width: 20px; text-align: center; flex: none; }
.mi-label { display: block; font-weight: 600; }
.mi-desc { display: block; font-size: 12px; color: var(--muted); margin-top: 1px; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .modules { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tk-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .modal.viewer { grid-template-columns: 1fr; grid-template-rows: minmax(0, 1fr) auto; }
  .vw-side { border-left: none; border-top: 1px solid var(--border); max-height: 45vh; }
}
@media (max-width: 600px) {
  .topbar, .board, .project-main { padding-left: 16px; padding-right: 16px; }
  .actions { width: 100%; }
  .board .actions input { flex: 1; }
  .form-grid, .tk-grid { grid-template-columns: 1fr; }
  .diag-form { padding: 20px 16px; }
  .q { flex-wrap: wrap; }
  .tk-row { flex-wrap: wrap; }
  .tk-meta { width: 100%; padding-left: 26px; flex-wrap: wrap; }
  .tk-add { flex-wrap: wrap; }
  .tk-add input[name=title] { flex-basis: 100%; }
  .module-head { flex-wrap: wrap; }
  .module-count { order: 5; flex-basis: 100%; padding-left: 32px; }
  .cal-cell { min-height: 60px; }
  .cal-cell .chip { font-size: 0; height: 6px; padding: 0; }
  .up-date { width: 70px; }
}

/* =========================================================
   Tipos de proyecto: grupos, ficha, objetivos, estadísticas
   ========================================================= */
.group { margin-bottom: 40px; }
.group-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; margin-bottom: 14px; }
.group-head h2 { font-size: 17px; }
.group-head h2 .muted { font-weight: 500; font-size: 14px; margin-left: 4px; }
.group-head p { margin: 3px 0 0; }
.group.pending .card { border-style: dashed; }
.classify { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }

.kind-badge { font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 99px; white-space: nowrap; flex: none; }
.kind-long { background: #d6f1e3; color: #18784b; }
.kind-short { background: #f7ebcc; color: var(--warn); }

.badge.s-cotizacion { background: #ebe3d5; color: var(--muted); }
.badge.s-preproduccion { background: #ebe2fa; color: #6639c4; }
.badge.s-produccion { background: #dce5fa; color: #2c58bd; }
.badge.s-postproduccion { background: #d4eff2; color: #127582; }
.badge.s-revision-del-cliente { background: #f4e3bf; color: var(--warn); }
.badge.s-entregado { background: #d6f1e3; color: #18784b; }
.countdown.done { color: #18784b; }

/* Selector de tipo (tarjetas) */
.type-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.kind-pick { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.type-card { cursor: pointer; display: block; background: none; border: none; padding: 0; text-align: left; }
.type-card input { position: absolute; opacity: 0; pointer-events: none; }
.type-card > span {
  display: flex; flex-direction: column; gap: 4px; height: 100%;
  background: var(--panel); border: 1.5px solid var(--border); border-radius: 12px; padding: 14px;
  transition: border-color .15s, background .15s;
}
.type-card small { color: var(--muted); font-size: 12px; line-height: 1.35; }
.type-card:hover > span { border-color: var(--border-2); }
.type-card input:checked + span { border-color: var(--accent); background: var(--accent-soft); }
.type-card input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.tc-icon { font-size: 22px; }
.type-card.big > span { padding: 20px; }
.type-card.big:hover > span { border-color: var(--accent); background: var(--accent-soft); }
.classify-block { padding: 26px 28px; display: flex; flex-direction: column; gap: 10px; border-color: var(--accent); }
.classify-block h2 { font-size: 22px; margin-bottom: 8px; }

.pseudo-label { display: flex; flex-direction: column; gap: 6px; color: var(--muted); font-size: 12.5px; }
.duration-out { color: var(--text); font-weight: 600; font-size: 14px; padding: 8px 0; }
.span2 { grid-column: span 2; }
.spec-type { color: var(--accent); }

/* Ficha: estado por etapas */
.stepper { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 6px; margin-bottom: 18px; }
.step {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  background: var(--panel); border: 1px solid var(--border); border-radius: 10px;
  padding: 10px 6px; cursor: pointer; text-align: center; color: var(--muted); font-size: 12px; line-height: 1.25;
}
.step-label { max-width: 100%; }
.step:hover { border-color: var(--border-2); color: var(--text); }
.step-dot {
  width: 22px; height: 22px; border-radius: 50%; flex: none; display: grid; place-items: center;
  background: var(--card-2); font-size: 11px; font-weight: 700;
}
.step.done { color: var(--text); }
.step.done .step-dot { background: #d6f1e3; color: #18784b; }
.step.current { border-color: var(--accent); background: var(--accent-soft); color: var(--text); font-weight: 600; }
.step.current .step-dot { background: var(--accent); color: #fff; }

.brief-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 24px; margin-top: 18px; }
.sub-h { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: 10px; font-weight: 600; }
.sub-h .muted { text-transform: none; letter-spacing: 0; font-weight: 500; margin-left: 6px; }
.kv.tight { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }

.st-en-proceso { --st: #1c1a17; }
.st-aprobado { --st: #c28a1e; }
.st-entregado { --st: #1f9d63; }
.dl-list { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.dl-list li.dl {
  display: flex; align-items: center; gap: 10px;
  background: var(--panel); border: 1px solid var(--border); border-left: 3px solid var(--st);
  border-radius: 10px; padding: 6px 6px 6px 10px;
}
.dl-name { font-weight: 600; }
li.dl.st-entregado .dl-name { text-decoration: line-through; color: var(--muted); }
.dl-due { padding: 4px 6px; font-size: 12px; border-color: transparent; background: transparent; color: var(--muted); }
.dl-due:hover { border-color: var(--border); }
.dl-add { display: flex; gap: 6px; flex-wrap: wrap; }
.dl-add input[name=name] { flex: 2 1 160px; }
.dl-add input[name=detail] { flex: 1 1 120px; }

.chip.mk { background: #d6f1e3; color: #18784b; font-weight: 600; }
.chip.dv { background: #f9eed3; color: #6f4d0f; border-left: 3px solid var(--st); }
.chip.dv.done { text-decoration: line-through; opacity: .55; }

/* Objetivos */
.ob-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
li.ob { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; }
li.ob.ok { border-left: 3px solid var(--ok); }
li.ob.late { border-left: 3px solid var(--danger); }
.ob-row { display: flex; align-items: center; gap: 14px; padding: 10px 8px 10px 14px; cursor: pointer; }
.ob-main { flex: 1; min-width: 0; }
.ob-title { font-weight: 600; }
.ob-prog { display: flex; align-items: center; gap: 8px; flex: none; }
.ob-prog .progress { width: 140px; height: 8px; }
.ob-prog .progress > span { background: var(--ok); }
.ob-pct { font-weight: 700; min-width: 40px; text-align: right; font-variant-numeric: tabular-nums; }
.badge.late-badge { background: #f2cdd1; color: #b3303d; }
.check-line { flex-direction: row !important; align-items: center; gap: 8px !important; color: var(--text) !important; align-self: end; padding-bottom: 9px; }

/* Estadísticas */
.unit-in { width: 160px; }
.mt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.mt-card {
  background: var(--panel); border: 1px solid var(--border); border-radius: 12px;
  padding: 14px; text-align: left; cursor: pointer; display: flex; flex-direction: column; gap: 4px;
  transition: border-color .15s;
}
.mt-card:hover { border-color: var(--border-2); }
.mt-card.on { border-color: var(--accent); }
.mt-name { color: var(--muted); font-size: 12.5px; font-weight: 600; }
.mt-val { font-size: 26px; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.mt-unit { font-size: 13px; font-weight: 500; color: var(--muted); }
.mt-delta { font-size: 12px; }
.mt-delta .arrow { font-size: 10px; }
.mt-delta.up .arrow { color: var(--ok); }
.mt-delta.down .arrow { color: var(--danger); }
.spark { width: 100%; height: 36px; margin-top: 6px; display: block; }
.spark-empty { height: 36px; margin-top: 6px; display: flex; align-items: center; font-size: 11.5px; }

.mt-detail { margin-top: 16px; padding: 16px; background: var(--panel); border: 1px solid var(--border); border-radius: 12px; display: flex; flex-direction: column; gap: 14px; }
.mt-detail-head { display: flex; align-items: center; gap: 8px; }
.mt-name-in { font-weight: 700; font-size: 15px; flex: 0 1 320px; }
.mt-chart { position: relative; }
.big-chart { width: 100%; height: auto; display: block; overflow: visible; }
.grid-line { stroke: var(--border); stroke-dasharray: 3 4; }
.axis-label { fill: var(--muted); font-size: 11px; font-family: inherit; }
.hover-line { stroke: var(--border-2); stroke-width: 1; }
.chart-empty { padding: 30px; text-align: center; border: 1px dashed var(--border-2); border-radius: 10px; }
.mt-tip {
  position: absolute; transform: translate(-50%, calc(-100% - 14px)); pointer-events: none;
  background: var(--card-2); border: 1px solid var(--border-2); border-radius: 8px;
  padding: 6px 10px; white-space: nowrap; box-shadow: 0 6px 20px rgba(60, 45, 20, .22);
}
.mt-entry-add { display: flex; gap: 8px; flex-wrap: wrap; }
.mt-entry-add input[name=value] { width: 140px; }
.mt-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.mt-table th { text-align: left; color: var(--muted); font-weight: 500; font-size: 12px; padding: 6px 8px; border-bottom: 1px solid var(--border); }
.mt-table td { padding: 6px 8px; border-bottom: 1px solid var(--border); font-variant-numeric: tabular-nums; }
.mt-table td:last-child { text-align: right; width: 40px; }

/* Ficha corta: filas de agregar, equipo, fechas, entregables */
.sub-label { font-size: 12.5px; font-weight: 600; color: var(--text); margin: 16px 0 8px; }
.spec-block + .spec-block { margin-top: 6px; }
.spec-block .sub-label { margin-top: 4px; }
.add-row { display: flex; gap: 8px; flex-wrap: wrap; }
.add-row input { flex: 1 1 200px; }
.team-list, .dates-list { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.team-row, .date-row {
  display: flex; align-items: center; gap: 8px;
  background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 6px 6px 6px 12px;
}
.team-row input, .date-row input[data-date-f=label] { flex: 1; min-width: 0; }
.team-row select { width: 150px; }
.role-icon { width: 20px; text-align: center; }

.dv-line { display: flex; flex-wrap: wrap; gap: 6px; }
.dv-line > * { flex: 1 1 110px; }
.dv-line [data-dv=name] { flex: 2 1 150px; }
.dv-line [data-dv=qty] { flex: 0 0 72px; }
.dv-line [data-dv=dateId] { flex: 1.4 1 160px; }
.dv-line [data-dv=newDate] { flex: 0 1 150px; border-color: var(--accent); }
.dv-line [data-dv-add] { flex: 0 0 auto; }
.dv-cards, .dv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; margin-top: 12px; }
.dv-cards > p, .dv-grid > p { grid-column: 1 / -1; margin: 0; }
.dv-card {
  background: var(--panel); border: 1px solid var(--border); border-top: 3px solid var(--st, var(--accent));
  border-radius: 12px; padding: 10px 10px 10px 12px; display: flex; flex-direction: column; gap: 8px;
  animation: pop .2s ease;
}
.dv-card.st-entregado .dv-name { text-decoration: line-through; color: var(--muted); }
.dv-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 6px; }
.dv-name { font-weight: 700; font-size: 14.5px; }
.dv-qty { color: var(--accent); margin-right: 4px; }
.dv-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.dv-tag { font-size: 11.5px; background: var(--card-2); color: var(--text); padding: 2px 8px; border-radius: 6px; }
.dv-foot { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: auto; }

.info-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-top: 4px; }
.info-card { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 14px; }
.rows { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.rows > div { display: flex; justify-content: space-between; gap: 12px; }
.rows dt { color: var(--muted); font-size: 12.5px; flex: none; }
.rows dd { margin: 0; text-align: right; font-weight: 600; overflow-wrap: anywhere; }
.rows a { color: #3d3830; }
.team-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.team-chip { background: var(--card-2); border-radius: 99px; padding: 4px 10px; font-size: 12.5px; }
.section-h { margin-top: 22px; }

.deliveries { display: flex; flex-direction: column; gap: 12px; }
.delivery { border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: 12px; padding: 12px 14px; }
.delivery.done { border-left-color: var(--ok); }
.delivery.late { border-left-color: var(--danger); }
.delivery-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.delivery-date { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.delivery .dv-grid { margin-top: 10px; }
.summary-entry { margin-top: 12px; padding: 12px; border: 1px dashed var(--border-2); border-radius: 12px; }

.rs-link { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.rs-link input[name=url] { flex: 3 1 260px; }
.rs-link-name { flex: 1 1 140px; }
.rs-link-icon { font-size: 16px; }

@media (max-width: 600px) {
  .dv-line [data-dv=name], .dv-line [data-dv=dateId], .dv-line [data-dv-add] { flex-basis: 100%; }
}

/* Horario: deslizador de dos controles */
.trange-field { display: flex; flex-direction: column; gap: 8px; color: var(--muted); font-size: 12.5px; padding: 4px 0 18px; }
.trange-head { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.trange-out { color: var(--text); font-size: 13.5px; }
.trange { position: relative; height: 26px; margin: 0 9px; }
.trange-track, .trange-fill { position: absolute; top: 50%; height: 6px; transform: translateY(-50%); border-radius: 99px; }
.trange-track { left: 0; right: 0; background: var(--border-2); }
.trange-fill { left: var(--a); right: calc(100% - var(--b)); background: var(--accent); }
.trange input[type=range] {
  position: absolute; left: -9px; right: -9px; width: calc(100% + 18px); top: 0; height: 100%; margin: 0;
  -webkit-appearance: none; appearance: none; background: transparent; pointer-events: none; padding: 0; border: none;
}
.trange input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none; pointer-events: auto; width: 20px; height: 20px; border-radius: 50%;
  background: #fff; border: 4px solid var(--accent); cursor: grab; box-shadow: 0 2px 6px rgba(60, 45, 20, .22);
}
.trange input[type=range]::-moz-range-thumb {
  pointer-events: auto; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 4px solid var(--accent); cursor: grab;
}
.trange input[type=range]:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--text); outline-offset: 2px; }
.trange-scale { position: relative; height: 14px; margin: 0 9px; font-size: 11px; }
.trange-scale span { position: absolute; transform: translateX(-50%); white-space: nowrap; }
.trange-scale span:first-child { transform: none; }
.trange-scale span:last-child { transform: translateX(-100%); }

/* Etapas como apartados */
.stage-block { padding: 0; }
.st-chips { margin-bottom: 14px; }
.st-chips .chip-btn.is-current { border-color: var(--border-2); color: var(--text); }
.st-chips .chip-btn.on { background: var(--accent-soft); border-color: var(--accent); }
.step.viewing { box-shadow: 0 0 0 2px var(--text); }
.stage-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; margin: 4px 0 14px; }
.stage-head h3 { font-size: 18px; }
.stage-head p { margin: 3px 0 0; }
.stage-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.badge.s-acercamiento { background: #f9eed3; color: #6f4d0f; }

.ap-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.ap-col { display: flex; flex-direction: column; gap: 12px; }
.form-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.info-card .add-row { margin-top: 2px; }
.doc-list { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.doc-list li { display: flex; align-items: center; gap: 10px; padding: 5px 4px 5px 6px; border-radius: 8px; }
.doc-list li:hover { background: var(--card); }
.doc-list li span { flex: 1; }
.doc-list li.done span { text-decoration: line-through; color: var(--muted); }
.sug-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.sug-chips .chip-btn { font-size: 12px; padding: 3px 9px; }
.file-list { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.file-list li { display: flex; align-items: center; gap: 10px; background: var(--card); border-radius: 10px; padding: 8px 8px 8px 10px; }
.file-icon { font-size: 20px; }
.ap-drop { margin-bottom: 0; padding: 18px; }
.modal.pdf-modal { width: min(1000px, 100%); height: min(860px, calc(100vh - 32px)); display: flex; flex-direction: column; }
.pdf-frame { flex: 1; width: 100%; border: none; border-radius: 10px; background: #fff; min-height: 300px; }
.modal-head .actions { display: flex; gap: 8px; align-items: center; }

/* Preproducción */
.subtabs { display: flex; gap: 4px; border-bottom: 1px solid var(--border); margin-bottom: 16px; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
.subtab {
  background: none; border: none; border-bottom: 2px solid transparent; padding: 9px 14px; cursor: pointer;
  color: var(--muted); font-weight: 600; white-space: nowrap; margin-bottom: -1px;
}
.subtab:hover { color: var(--text); }
.subtab.on { color: var(--text); border-bottom-color: var(--accent); }

.pp-q { display: flex; flex-direction: column; gap: 14px; }
.pp-q > p { margin: 0; }
.pq { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.pq > input { width: 100%; }
.pq-q { font-weight: 600; display: flex; gap: 10px; align-items: baseline; }
.pq-n { width: 22px; height: 22px; border-radius: 50%; background: var(--accent-soft); color: #3d3830; font-size: 11px; display: inline-grid; place-items: center; flex: none; }
.opts { display: flex; flex-wrap: wrap; gap: 6px; }
.opt input { position: absolute; opacity: 0; pointer-events: none; }
.opt span { display: block; padding: 6px 12px; border-radius: 99px; border: 1px solid var(--border-2); cursor: pointer; font-size: 13px; color: var(--muted); }
.opt:hover span { color: var(--text); }
.opt input:checked + span { background: var(--accent-soft); border-color: var(--accent); color: var(--text); }
.opt input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }

.route { display: flex; flex-direction: column; gap: 14px; }
.route-head { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.route-head h4 { font-size: 16px; }
.route-head p { margin: 3px 0 0; }
.route-btns { display: flex; gap: 8px; align-items: flex-start; }
.route-btns .btn:disabled { opacity: .6; cursor: default; filter: none; }
.route-summary { background: var(--panel); border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; }
.alerts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.alert { display: flex; gap: 10px; padding: 9px 12px; border-radius: 10px; font-size: 13px; }
.alert.warn { background: #f9eed3; color: #6f4d0f; }
.alert.info { background: var(--accent-soft); color: #31449a; }
.phases { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.phase { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px; }
.phase-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.phase-head .muted { margin-left: auto; }
.phase-items { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; counter-reset: step; }
.phase-items li { display: flex; align-items: flex-start; gap: 8px; padding: 8px; border-radius: 8px; counter-increment: step; }
.phase-items li::before { content: counter(step); font-size: 11px; font-weight: 700; color: var(--muted); width: 16px; flex: none; padding-top: 2px; }
.phase-items li:hover { background: var(--card); }
.phase-items li.in-tasks .ri-title { color: var(--muted); }
.ri-title { font-weight: 600; }
.ri-why { font-size: 12px; color: #6639c4; margin-top: 2px; }
.answers summary { cursor: pointer; color: var(--muted); font-size: 13px; }
.answers .rows { margin-top: 10px; }
.answers .rows dd { max-width: 50%; }

.sc-bar { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.sc-new { display: flex; gap: 8px; flex-wrap: wrap; }
.sc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.sc-card { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px; cursor: pointer; display: flex; flex-direction: column; gap: 4px; outline: none; }
.sc-card:hover, .sc-card:focus-visible { border-color: var(--accent); }
.sc-top { display: flex; justify-content: space-between; align-items: flex-start; }
.sc-icon { font-size: 22px; }
.sc-title { font-weight: 700; }
.sc-preview { font-size: 12px; color: var(--muted); white-space: pre-line; max-height: 4.5em; overflow: hidden; margin-top: 4px; font-family: ui-monospace, Consolas, monospace; }
.modal.editor-modal { width: min(900px, 100%); height: min(820px, calc(100vh - 32px)); display: flex; flex-direction: column; gap: 10px; }
.sc-title-in { flex: 1; font-size: 17px; font-weight: 700; background: transparent; border-color: transparent; }
.sc-title-in:hover { border-color: var(--border); }
.sc-text { flex: 1; resize: none; font-family: ui-monospace, Consolas, monospace; font-size: 13.5px; line-height: 1.6; padding: 14px; }
.sc-foot { display: flex; align-items: center; gap: 14px; }
.sc-foot .btn { margin-left: auto; }

@media (max-width: 900px) {
  .ap-grid { grid-template-columns: 1fr; }
}

/* Ruta: fases desplegables y tarjetas por paso */
details.phase > summary { list-style: none; cursor: pointer; user-select: none; }
details.phase > summary::-webkit-details-marker { display: none; }
details.phase:not([open]) > summary { margin-bottom: 0; }
.phase-chev { display: inline-block; width: 14px; color: var(--muted); transition: transform .15s; font-size: 12px; }
details[open] > summary .phase-chev { transform: rotate(90deg); }
.phases { align-items: start; }
.phase-items li[data-step] { cursor: pointer; border: 1px solid transparent; }
.phase-items li[data-step]:hover, .phase-items li[data-step]:focus-visible { background: var(--card); border-color: var(--border-2); outline: none; }
.phase-items li.step-done .ri-title { color: var(--ok); }
.step-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex: none; }
.step-hint { font-size: 11.5px; color: var(--muted); opacity: 0; margin-top: 2px; transition: opacity .15s; }
.phase-items li:hover .step-hint, .phase-items li:focus-visible .step-hint { opacity: 1; }
.step-print { margin-top: 8px; padding: 8px 10px; background: var(--bg); border-radius: 8px; border-left: 2px solid var(--accent); }
.step-print dl { margin: 0; display: flex; flex-direction: column; gap: 4px; }
.step-print dl > div { display: grid; grid-template-columns: minmax(90px, 35%) 1fr; gap: 8px; font-size: 12.5px; }
.step-print dt { color: var(--muted); }
.step-print dd { margin: 0; white-space: pre-line; overflow-wrap: anywhere; }
.step-print a { color: #3d3830; }
.modal.step-modal { width: min(640px, 100%); }
.step-modal .eyebrow { font-size: 11px; }
.step-modal h3 { margin: 2px 0 0; }
.step-context { background: var(--card); border-radius: 10px; padding: 10px 12px; font-size: 13px; color: var(--muted); margin-bottom: 14px; display: flex; flex-direction: column; gap: 4px; }
.step-form { margin-bottom: 16px; }
.step-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; background: var(--card); border-radius: 10px; padding: 10px 12px; }
.step-checks .check-line, .done-line { padding-bottom: 0; align-self: auto; }
.done-line { border-top: 1px solid var(--border); padding-top: 12px; font-weight: 600; }

/* Tareas por etapa */
details.stage-tasks { margin-top: 18px; border: 1px solid var(--border); border-radius: 12px; background: var(--panel); }
details.stage-tasks > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 12px 14px; user-select: none; }
details.stage-tasks > summary::-webkit-details-marker { display: none; }
details.stage-tasks[open] > summary { border-bottom: 1px solid var(--border); }
.stage-tasks-count { margin-left: auto; }
.stage-tasks-body { padding: 14px; }
.stage-tasks-body li.tk { background: var(--card); }

/* Tareas: vista lista / calendario */
.tk-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.tk-top .tk-stats { margin-bottom: 0; }
.view-seg { display: inline-flex; background: var(--bg); border: 1px solid var(--border); border-radius: 9px; padding: 3px; }
.view-seg button { background: none; border: none; padding: 5px 12px; border-radius: 7px; cursor: pointer; color: var(--muted); font-weight: 600; font-size: 12.5px; }
.view-seg button.on { background: var(--card-2); color: var(--text); }
.tcal-cell { min-height: 104px; }
.tcal-cell .chip { cursor: pointer; }
.tcal-cell .chip:hover { filter: brightness(.95); }
.chip.tk.late { box-shadow: inset 0 0 0 1px var(--danger); }
.mod-chev { font-size: 13px; padding: 4px 6px; margin-right: -4px; }

/* Entregables: tarjeta clicable + editor */
.dv-card[data-dv-open] { cursor: pointer; transition: border-color .15s, transform .15s; }
.dv-card[data-dv-open]:hover, .dv-card[data-dv-open]:focus-visible { border-color: var(--accent); transform: translateY(-1px); outline: none; }
.dv-edit-hint { color: var(--muted); font-size: 13px; opacity: 0; transition: opacity .15s; }
.dv-card:hover .dv-edit-hint, .dv-card:focus-visible .dv-edit-hint { opacity: 1; }
.modal.dv-modal { width: min(600px, 100%); }
.modal-actions.split { align-items: center; margin-top: 16px; }
.modal-actions.split .grow { flex: 1; }
.dv-edit { margin-top: 6px; }

/* Producción */
.crew { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.crew li { display: flex; align-items: center; gap: 8px; background: var(--card); border-radius: 10px; padding: 6px 8px; }
.crew input[type=time] { width: 110px; }
.crew input[type=tel] { width: 140px; }
.timeline { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.timeline li { display: flex; gap: 6px; align-items: center; }
.timeline li input[type=time] { width: 110px; flex: none; }
.timeline li input[data-tl-f=act] { flex: 2; }
.timeline li input[data-tl-f=owner] { flex: 1; }
.info-card > .btn.sm { margin-top: 8px; }
.gear-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.gear-add { margin-bottom: 8px; }
.gear-add .g-cat { flex: 0 1 170px; }
.gear-add .g-qty { flex: 0 0 70px; }
.gear-cat { margin-top: 6px; }
.table-wrap { overflow-x: auto; }
.gear-table, .script-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.gear-table th, .script-table th { text-align: left; color: var(--muted); font-weight: 500; font-size: 11.5px; padding: 6px 8px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.gear-table td, .script-table td { padding: 5px 8px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.gear-table tr.packed .g-n { color: var(--muted); }
.gear-table .g-n { font-weight: 600; }
.gear-table select, .gear-table input:not([type=checkbox]) { padding: 4px 8px; font-size: 12.5px; }
.g-qty-in { width: 64px; }
.gear-cat .gear-table { table-layout: fixed; }
.gear-cat .gear-table th:nth-child(1), .gear-cat .gear-table th:nth-child(5) { width: 84px; }
.gear-cat .gear-table th:nth-child(3) { width: 86px; }
.gear-cat .gear-table th:nth-child(4) { width: 150px; }
.gear-cat .gear-table th:nth-child(6) { width: 40px; }
.gear-cat .gear-table select { width: 100%; }
.bk-sum { margin: 10px 0 4px; }
.maps-btn { margin-top: 12px; }
.script-intro { margin-bottom: 10px; }
.script-table td:first-child { color: var(--muted); width: 32px; }
.script-table td:nth-child(2) { font-weight: 600; }
.script-pre { white-space: pre-wrap; font-family: ui-monospace, Consolas, monospace; font-size: 13px; margin: 0; }

/* Postproducción */
.post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin-top: 10px; }
.post-card {
  --st: var(--muted);
  background: var(--panel); border: 1px solid var(--border); border-top: 3px solid var(--st);
  border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; cursor: pointer; outline: none;
  transition: border-color .15s, transform .15s;
}
.post-card:hover, .post-card:focus-visible { border-color: var(--accent); transform: translateY(-2px); }
.post-card.st-en-edicion, .post-card.st-color-y-sonido, .post-card.st-exportado { --st: #1c1a17; }
.post-card.st-en-revision-del-cliente { --st: #7a4ddf; }
.post-card.st-aprobado { --st: #c28a1e; }
.post-card.st-entregado { --st: #1f9d63; }
.post-status { font-size: 11.5px; font-weight: 700; color: var(--st); white-space: nowrap; }
.post-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.post-links { display: flex; gap: 10px; flex-wrap: wrap; font-size: 12px; color: var(--muted); }
.post-links .pend { color: #6639c4; }
.modal.work-modal { width: min(760px, 100%); }
.work-modal .dv-tags { margin-top: 6px; }
.link-row { display: flex; gap: 8px; }
.link-row input { flex: 1; }
.ver-list { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ver-list li { display: flex; align-items: center; gap: 10px; background: var(--card); border-radius: 10px; padding: 8px 10px; }
.ver-list a { color: #3d3830; overflow-wrap: anywhere; }
.ver-label { font-weight: 700; background: var(--accent-soft); color: #3d3830; border-radius: 6px; padding: 2px 8px; font-size: 12px; flex: none; }
.ver-add .ver-name { flex: 0 0 70px; }
.ver-add .ver-link { flex: 2 1 220px; }

/* Revisión del cliente */
.rv-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 14px; align-items: start; }
.rv-list { display: flex; flex-direction: column; gap: 6px; position: sticky; top: 84px; }
.rv-item { text-align: left; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; cursor: pointer; display: flex; flex-direction: column; gap: 2px; }
.rv-item:hover { border-color: var(--border-2); }
.rv-item.on { border-color: var(--accent); background: var(--accent-soft); }
.rv-main { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.rv-player { position: relative; aspect-ratio: 16 / 9; background: #000; border-radius: 12px; overflow: hidden; }
.rv-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: none; }
.rv-links { display: flex; gap: 8px; flex-wrap: wrap; }
.rv-setup p { margin: 0 0 10px; }
.rv-comments-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.rv-comments-head .sub-h { margin: 0; }
.rc-add .rc-time { flex: 0 0 80px; }
.rc-add .rc-text { flex: 3 1 220px; }
.rc-add .rc-author { flex: 1 1 120px; }
.rc-add .btn.sm { flex: 0 0 auto; }
.rv-comments { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.rv-comments li { display: flex; align-items: flex-start; gap: 10px; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; }
.rv-comments li.resolved .rc-body { text-decoration: line-through; color: var(--muted); }
.rv-comments li.empty-c { background: none; border: none; padding: 4px 0; }
.rv-comments .check-line { padding: 0; align-self: center; font-size: 12px; white-space: nowrap; }
.tc {
  flex: none; font-variant-numeric: tabular-nums; font-weight: 700; font-size: 12.5px;
  background: var(--accent-soft); color: #3d3830; border: 1px solid transparent; border-radius: 8px; padding: 4px 9px; cursor: pointer;
}
.tc:hover:not(:disabled) { border-color: var(--accent); }
.tc:disabled { opacity: .6; cursor: default; }
.rc-body { white-space: pre-line; }
.rv-foot { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.rv-foot .btn:disabled { opacity: .5; cursor: default; filter: none; }
@media (max-width: 900px) {
  .rv-layout { grid-template-columns: 1fr; }
  .rv-list { position: static; flex-direction: row; overflow-x: auto; }
  .rv-item { min-width: 180px; }
}

/* Tarjetas de especificaciones editables (⋯) */
.card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.card-head .sub-h { margin-bottom: 10px; }
.card-head .icon-btn { font-size: 18px; padding: 0 8px 4px; margin-top: -4px; }
.spec-card.editing { grid-column: 1 / -1; border-color: var(--accent); }
.spec-card.editing .form-grid { margin-bottom: 14px; }

/* Equipo y documentos */
.people-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; }
.person-card { padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.person-head { display: flex; align-items: center; gap: 10px; }
.person-name { flex: 1; font-size: 16px; font-weight: 700; background: transparent; border-color: transparent; padding: 4px 6px; }
.person-name:hover { border-color: var(--border); }
.avatar.big { width: 36px; height: 36px; font-size: 13px; flex: none; }
.pdoc-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.pdoc { display: flex; align-items: center; gap: 8px; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 8px 8px 8px 10px; }
.pdoc.ok { border-left: 3px solid var(--ok); }
.pdoc.missing { border-left: 3px solid var(--warn); border-style: dashed; border-left-style: solid; }
.pdoc.over { border-color: var(--accent); background: var(--accent-soft); }
.pdoc-icon { width: 20px; text-align: center; }
.pdoc .grow > div { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Documentos del equipo en el acercamiento */
.pd-builder { display: flex; flex-direction: column; gap: 8px; background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 12px; }
.pd-person { max-width: 260px; }
.pd-source { display: flex; flex-wrap: wrap; gap: 6px; }
.pd-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 99px;
  background: var(--card-2); border: 1px solid var(--border-2); font-size: 12.5px; cursor: grab; user-select: none;
}
.pd-chip:hover { border-color: var(--accent); }
.pd-chip.picked { opacity: .45; }
.pd-chip.in { background: var(--accent-soft); border-color: var(--accent); cursor: default; }
.pd-chip.in button { background: none; border: none; cursor: pointer; color: var(--muted); padding: 0; font-size: 11px; }
.pd-drop {
  min-height: 46px; border: 1.5px dashed var(--border-2); border-radius: 10px; padding: 8px;
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center; transition: .15s;
}
.pd-drop.over { border-color: var(--accent); background: var(--accent-soft); }
.pd-drop.has { border-style: solid; }
.pd-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.pd-cards { display: flex; flex-direction: column; gap: 10px; margin: 12px 0 4px; }
.pd-card { border: 1px solid var(--border); border-radius: 12px; padding: 10px; display: flex; flex-direction: column; gap: 8px; animation: pop .2s ease; }
.pd-head { display: flex; align-items: center; gap: 8px; }
.info-card .sub-label:first-of-type { margin-top: 0; }

/* Momentos clave y referencias en el brief */
.lq-items { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.lq-items li { display: flex; align-items: center; gap: 10px; background: var(--card); border-radius: 8px; padding: 6px 6px 6px 10px; }
.lq-items li.lq-empty { background: none; padding: 4px 0; }
.lq-n { width: 22px; height: 22px; border-radius: 50%; background: var(--card-2); font-size: 11px; font-weight: 700; display: grid; place-items: center; flex: none; }
.refs-box { border-top: 1px dashed var(--border-2); padding-top: 12px; display: flex; flex-direction: column; gap: 10px; }
.refs-box .rs-drop { padding: 14px; }

.quick-add { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin: 14px 0 8px; }

@media (max-width: 900px) {
  .brief-cols { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .kind-pick { grid-template-columns: 1fr; }
  .span2 { grid-column: auto; }
  .ob-row { flex-wrap: wrap; }
  .ob-prog { width: 100%; }
  .ob-prog .progress { flex: 1; }
  .unit-in { width: 100%; }
  .group-head { flex-direction: column; align-items: flex-start; }
}

/* =========================================================
   Estructura: barra lateral + panel central
   ========================================================= */
.shell { display: flex; min-height: 100vh; }
.main { flex: 1; min-width: 0; }
.sidebar {
  width: 236px; flex: none; position: sticky; top: 0; height: 100vh; z-index: 40;
  background: var(--panel); border-right: 1px solid var(--border);
  display: flex; flex-direction: column; padding: 14px 10px; gap: 6px;
}
.sb-head { display: flex; align-items: center; gap: 10px; padding: 4px 6px 14px; border-bottom: 1px solid var(--border); margin-bottom: 8px; }
.sb-head .brand-mark { width: 36px; height: 36px; font-size: 17px; border-radius: 10px; }
.sb-name { font-size: 18px; font-weight: 700; flex: 1; }
.sb-hide { font-size: 18px; }
.sb-nav { display: flex; flex-direction: column; gap: 2px; }
.sb-link {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px;
  color: var(--muted); text-decoration: none; font-weight: 600; font-size: 14.5px;
}
.sb-link:hover { background: var(--card); color: var(--text); }
.sb-link.on { background: var(--accent-soft); color: var(--text); }
.sb-link.on .sb-icon { filter: none; }
.sb-icon { width: 22px; text-align: center; font-size: 17px; }
.sb-link.small { font-size: 13px; padding: 8px 12px; }
.sb-foot { margin-top: auto; border-top: 1px solid var(--border); padding-top: 8px; }
.sb-open {
  position: fixed; top: 14px; left: 14px; z-index: 45; width: 40px; height: 40px; border-radius: 10px;
  background: var(--card); border: 1px solid var(--border-2); color: var(--text); font-size: 18px; cursor: pointer;
  display: none; box-shadow: 0 6px 18px rgba(0, 0, 0, .35);
}
.sb-open:hover { border-color: var(--accent); }
.sb-scrim { display: none; }
body.sb-hidden .sidebar { display: none; }
body.sb-hidden .sb-open { display: block; }
body.sb-hidden .main > .topbar, body.sb-hidden .main > header.topbar { padding-left: 70px; }
.page-main { padding: 22px 32px 80px; display: flex; flex-direction: column; gap: 18px; max-width: 1400px; margin: 0 auto; }
.cal-nav h4 { text-transform: none; }

@media (max-width: 900px) {
  .sidebar { position: fixed; left: 0; top: 0; bottom: 0; box-shadow: 10px 0 40px rgba(60, 45, 20, .28); }
  body.sb-shown .sb-scrim { display: block; position: fixed; inset: 0; background: rgba(60, 45, 20, .28); z-index: 39; }
  .main > .topbar { padding-left: 70px; }
  body.sb-shown .sb-open { display: none; }
  .page-main { padding: 16px 16px 60px; }
}

/* Estadísticas en fila */
.stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.stat { background: var(--card); border: 1px solid var(--border); border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.stat-l { color: var(--muted); font-size: 12.5px; font-weight: 600; }
.stat-v { font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; }
.stat.neg .stat-v { color: var(--danger); }

/* Calendario general */
.gcal-filters { display: flex; flex-direction: column; gap: 8px; }
.pchip { display: inline-flex; align-items: center; gap: 6px; }
.pchip:not(.on) { opacity: .5; }
.pdot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--pc, var(--accent)); flex: none; }
.gcal-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.gcal-cell { min-height: 112px; }
.gcal-cell .cal-num { cursor: pointer; }
.gchip {
  display: flex; align-items: center; gap: 4px; font-size: 11.5px; padding: 2px 6px; border-radius: 5px;
  background: color-mix(in srgb, var(--pc) 16%, var(--card)); border-left: 3px solid var(--pc);
  cursor: pointer; min-width: 0; flex: none;
}
.gchip:hover { filter: brightness(.95); }
.gchip-t { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gchip.done .gchip-t { text-decoration: line-through; opacity: .6; }
.gchip.wide { padding: 6px 8px; font-size: 13px; margin-bottom: 4px; }
.gchip.wide .gchip-t { flex: 1; }
.gchip-p { font-size: 11px; color: var(--muted); white-space: nowrap; }
.gcal-side { padding: 14px; position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow: auto; }
.agenda-day { margin-bottom: 12px; }
.agenda-date { font-size: 12px; font-weight: 700; color: var(--muted); margin-bottom: 4px; text-transform: none; }
.agenda-date.is-today { color: var(--accent); }
.day-items { display: flex; flex-direction: column; }
@media (max-width: 1100px) {
  .gcal-layout { grid-template-columns: 1fr; }
  .gcal-side { position: static; max-height: none; }
}
@media (max-width: 600px) {
  .gcal-cell { min-height: 64px; }
  .gcal-cell .gchip { font-size: 0; height: 6px; padding: 0; }
  .gcal-cell .gchip span { display: none; }
}

/* Contabilidad */
.acc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
/* Si solo hay un bloque (en los dashboards de PM, sin egresos), ocupa todo el ancho */
.acc-grid > :only-child { grid-column: 1 / -1; }
.acc-block { padding: 14px 16px; }
.acc-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.acc-head h3 { font-size: 16px; }
.acc-add { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.acc-add > * { flex: 1 1 120px; }
.acc-add [name=concept] { flex: 2 1 160px; }
.acc-add .btn { flex: 0 0 auto; }
/* Pista del máximo: ocupa su propia fila (no debe estirar los campos) */
.acc-add .acc-max { flex: 1 0 100%; padding: 0 2px; }
.acc-add .acc-max[hidden] { display: none; }
button.avg-owner { border: 0; font: inherit; cursor: pointer; }
/* Columnas de la tabla: fecha en una línea y destinatario con ancho suficiente */
.acc-table td:first-child, .acc-table th:first-child { white-space: nowrap; }
.acc-table th:nth-child(5), .acc-table td:nth-child(5) { min-width: 130px; white-space: normal; word-break: normal; }
.acc-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.acc-table th { text-align: left; color: var(--muted); font-weight: 500; font-size: 12px; padding: 7px 8px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.acc-table td { padding: 8px; border-bottom: 1px solid var(--border); }
.acc-table tbody tr[data-id], .acc-table tbody tr[data-goto] { cursor: pointer; }
.acc-table tbody tr[data-id]:hover, .acc-table tbody tr[data-goto]:hover { background: var(--card-2); }
.acc-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.acc-table tfoot td { border-bottom: none; font-weight: 600; }
.acc-table .neg { color: var(--danger); }
/* Destinatario: columna angosta para que quepa el resto */
.acc-table .acc-dest { width: 78px; max-width: 96px; white-space: normal; overflow-wrap: anywhere; font-size: 12px; }
.acc-table .acc-quien { white-space: normal; font-size: 12px; }
.empty-row { text-align: center; padding: 18px; }
.pay { font-size: 12px; font-weight: 600; white-space: nowrap; }
.pay.ok { color: var(--ok); }
.pay.pend { color: var(--warn); }
@media (max-width: 1100px) { .acc-grid { grid-template-columns: 1fr; } }
/* Contabilidad: bloques y meses desplegables con flecha */
details.acc-fold > summary.acc-head, details.hist-month > summary { list-style: none; cursor: pointer; user-select: none; }
details.acc-fold > summary::-webkit-details-marker, details.hist-month > summary::-webkit-details-marker { display: none; }
details.acc-fold > summary.acc-head { align-items: center; justify-content: flex-start; }
details.acc-fold > summary.acc-head .muted { margin-left: auto; }
.fold-chev { display: inline-block; font-size: 11px; opacity: .6; transition: transform .15s; }
details[open] > summary > .fold-chev { transform: rotate(90deg); }
details.acc-fold[open] > summary.acc-head { margin-bottom: 10px; }
.acc-hist { margin-top: 16px; }
details.hist-month { border-top: 1px solid var(--border); padding: 10px 0 4px; }
details.hist-month > summary { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 2px 0 8px; }
.hist-tot { margin-left: auto; font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.hist-actions { display: flex; justify-content: flex-end; margin-top: 14px; }
.pay.out { color: #b3303d; }

/* Clientes: secciones por área, proveedores y documentos */
.cl-group { font-size: 19px; margin: 22px 0 4px; }
.cl-section { margin-top: 12px; }
.cl-sec-h { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.cl-sec-h h2 { font-size: 15px; margin: 0; }
.cl-sec-h .muted { margin-left: auto; }
.cl-empty { margin: 4px 0 8px; }
.supplier-card { border-left: 4px solid #8c7a5b; }
.modal-head-acts { display: flex; align-items: center; gap: 8px; }
.doc-list { display: grid; gap: 6px; margin: 6px 0 10px; }
.doc-row { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--panel); flex-wrap: wrap; }
.doc-ic { font-size: 15px; }
.doc-name { font-weight: 600; flex: 1; min-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: inherit; }
.doc-upload { cursor: pointer; display: inline-flex; }
.doc-status { margin-left: 10px; }

/* Clientes v2: bloques desplegables, tarjetas con degradado y base de datos */
details.cl-fold { padding: 0; overflow: hidden; margin-top: 14px; }
details.cl-fold.db-sub { margin-top: 10px; border-radius: 12px; }
details.cl-fold > summary { list-style: none; cursor: pointer; user-select: none; }
details.cl-fold > summary::-webkit-details-marker { display: none; }
.cl-fold-h { display: flex; align-items: center; gap: 10px; padding: 14px 16px; }
.cl-fold-h h2 { font-size: 16px; margin: 0; }
.cl-fold-b { padding: 0 16px 16px; }
.cl-count { margin-left: auto; font-size: 12px; font-weight: 700; padding: 2px 10px; border-radius: 999px; background: var(--card-2, #efe9de); color: var(--muted); }
.cl-add-row { display: flex; justify-content: flex-end; margin-bottom: 8px; }
.client-card.cl-card {
  position: relative; overflow: hidden; color: #fff; border: 0; border-radius: 18px; padding: 16px;
  background: radial-gradient(circle at 22% 18%, rgba(255, 255, 255, .28), transparent 42%), radial-gradient(circle at 88% 82%, rgba(0, 0, 0, .18), transparent 46%), linear-gradient(160deg, color-mix(in srgb, var(--cc) 85%, #fff) 0%, var(--cc) 55%, color-mix(in srgb, var(--cc) 62%, #000) 100%);
  box-shadow: 0 10px 22px -14px var(--cc);
}
.client-card.cl-card:hover, .client-card.cl-card:focus-visible { transform: translateY(-2px); border-color: transparent; box-shadow: 0 16px 28px -14px var(--cc); }
.client-card.cl-card b, .client-card.cl-card .sm, .client-card.cl-card .cl-sub { color: #fff; }
.client-card.cl-card .cl-sub { opacity: .85; font-size: 12.5px; }
.client-card.cl-card .avatar { background: rgba(255, 255, 255, .22); color: #fff; }
.client-card.cl-card .card-trash { color: #fff; opacity: .8; }
.client-card.cl-card .card-trash:hover { color: #fff; opacity: 1; }
.cl-chip { font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: rgba(255, 255, 255, .22); color: #fff; }
.cl-foot { margin-top: auto; }
.db-table tbody tr { cursor: pointer; }
.db-table tbody tr:hover { background: rgba(0, 0, 0, .04); }
.db-table td { white-space: nowrap; }
/* Ficha de solo lectura de cliente o proveedor */
.cv-card { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; margin-top: 4px; }
.cv-row { display: grid; gap: 2px; padding: 9px 0; border-bottom: 1px solid var(--border); }
.cv-l { font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 600; }
.cv-v { font-size: 15px; font-weight: 600; word-break: break-word; }
.cv-notes { white-space: pre-wrap; background: var(--card-2, #efe9de); border-radius: 10px; padding: 10px 12px; margin: 4px 0 8px; }
.cv-docs { display: grid; gap: 6px; margin-bottom: 6px; }
@media (max-width: 640px) { .cv-card { grid-template-columns: 1fr; } }

/* Propuestas */
.prop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.prop-card { padding: 16px; display: flex; flex-direction: column; gap: 8px; cursor: pointer; transition: border-color .15s, transform .15s; outline: none; }
.prop-card:hover, .prop-card:focus-visible { border-color: var(--accent); transform: translateY(-2px); }
.prop-total { font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; margin-top: auto; }
.st-p-aceptada .badge { background: #d6f1e3; color: #18784b; }
.st-p-enviada .badge, .st-p-en-negociacion .badge { background: #dce5fa; color: #2c58bd; }
.st-p-rechazada .badge { background: #f2cdd1; color: #b3303d; }
.prop-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 18px; align-items: start; }
.prop-qs { display: flex; flex-direction: column; gap: 12px; }
.prop-sum { padding: 16px; position: sticky; top: 90px; display: flex; flex-direction: column; gap: 10px; }
.sum-group { display: flex; flex-direction: column; gap: 4px; }
.sum-g { font-size: 11.5px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; margin-top: 4px; }
.sum-line { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.sum-line span { display: flex; flex-direction: column; }
.sum-line small { color: var(--muted); font-size: 11.5px; }
.sum-line b { font-variant-numeric: tabular-nums; white-space: nowrap; }
.sum-tot { border-top: 1px solid var(--border); padding-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.sum-line.grand { font-size: 18px; border-top: 1px solid var(--border-2); padding-top: 8px; margin-top: 4px; }
.sum-actions { display: flex; flex-direction: column; gap: 8px; }
.crew-calc { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px; }
.crew-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; background: var(--card); border-radius: 10px; padding: 8px 10px; }
.crew-row > span:first-child { display: flex; flex-direction: column; font-weight: 600; }
.stepper-num { display: inline-flex; align-items: center; gap: 4px; flex: none; }
.stepper-num button { width: 28px; height: 28px; border-radius: 8px; border: 1px solid var(--border-2); background: var(--panel); color: var(--text); cursor: pointer; font-size: 16px; }
.stepper-num button:hover { border-color: var(--accent); }
.stepper-num b { min-width: 22px; text-align: center; font-variant-numeric: tabular-nums; }
.inline-l { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 12.5px; margin-top: 8px; }
.inline-l input { width: 90px; }
.modal.rates-modal { width: min(820px, 100%); }
.rates-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.rates-grid label { display: flex; flex-direction: column; gap: 5px; font-size: 12.5px; color: var(--text); }
.modal.prop-preview { width: min(820px, 100%); }
.pp-doc { background: #fff; color: #111; border-radius: 12px; padding: 28px; }
.pp-top { display: flex; gap: 16px; align-items: center; margin-bottom: 16px; }
.pp-brand { width: 48px; height: 48px; border-radius: 12px; background: var(--accent); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 22px; flex: none; }
.pp-doc h2 { margin: 0 0 4px; color: #111; }
.pp-table { width: 100%; border-collapse: collapse; margin: 14px 0; font-size: 13.5px; }
.pp-table th, .pp-table td { text-align: left; padding: 8px; border-bottom: 1px solid #ddd; }
.pp-table td:last-child, .pp-table th:last-child { text-align: right; white-space: nowrap; }
.pp-table tfoot td { font-weight: 600; }
.pp-table .grand td { font-size: 17px; border-top: 2px solid #111; }
@media (max-width: 1000px) {
  .prop-layout { grid-template-columns: 1fr; }
  .prop-sum { position: static; }
}

/* Clientes */
.client-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.client-card { padding: 16px; display: flex; flex-direction: column; gap: 6px; cursor: pointer; transition: border-color .15s, transform .15s; outline: none; }
.client-card:hover, .client-card:focus-visible { border-color: var(--accent); transform: translateY(-2px); }
.cl-head { display: flex; align-items: center; gap: 12px; margin-bottom: 4px; }
.cl-foot { display: flex; gap: 6px; flex-wrap: wrap; margin-top: auto; padding-top: 6px; }
.bday-badge { background: #fadeea; color: #a8356a; }
.bday-row { display: flex; gap: 8px; flex-wrap: wrap; }
.bday { background: #fdf0f5; border: 1px solid #f0c4d6; color: var(--text); border-radius: 12px; padding: 8px 14px; cursor: pointer; }
.bday:hover { border-color: #ff6b9d; }
.cl-import { align-items: center; }
.modal.client-modal { width: min(720px, 100%); }
.cl-history { display: flex; flex-direction: column; gap: 4px; }
.cl-link { color: #3d3830; text-decoration: none; padding: 6px 10px; background: var(--card); border-radius: 8px; }
.cl-link:hover { background: var(--card-2); }
.cl-quick { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }

/* Trofeos */
.trophy-empty { padding: 60px 20px; }
.trophy-big { font-size: 56px; }
.trophy-empty h3 { margin: 10px 0 6px; font-size: 20px; color: var(--text); }

/* Ficha y diagnóstico plegables */
.fold-head { cursor: pointer; flex-wrap: wrap; row-gap: 6px; }
.fold-head .module-name { white-space: nowrap; flex: none; }
.fold-head .countdown { min-width: 0; }
.brief-sum.collapsed .diag-body { display: none; }
.brief-sum.collapsed .module-head { border-bottom: none; }


/* Inicio: Hoy */
.sb-home { flex: 1; min-width: 0; padding: 6px 8px; }
.sb-home-t { display: flex; flex-direction: column; line-height: 1.2; }
.sb-sub { font-size: 11.5px; color: var(--muted); font-weight: 500; }
.sb-home.on .sb-sub { color: var(--accent); }
.today-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.today-block { padding: 16px 18px; }
.today-block h3 { font-size: 16px; margin-bottom: 12px; }
.today-block h3 .muted { font-weight: 500; margin-left: 6px; }
.today-block.has-late { border-color: #f2cdd1; }
.today-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.today-list + .today-list { margin-top: 6px; }
.today-task, .today-meet, .today-deliv { display: flex; align-items: center; gap: 10px; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; flex-wrap: wrap; }
.today-t { flex: 1; min-width: 140px; text-align: left; background: none; border: none; cursor: pointer; font-weight: 600; padding: 2px 0; }
.today-t:hover { color: #3d3830; }
.today-task.done .today-t { text-decoration: line-through; color: var(--muted); }
.today-p { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.today-meet a, .today-deliv a { color: var(--text); text-decoration: none; }
.today-meet a:hover, .today-deliv a:hover { color: #3d3830; }
.meet-time { font-weight: 700; font-variant-numeric: tabular-nums; min-width: 48px; color: var(--accent); }
.meet-icon { font-size: 16px; }
.today-deliv { border-left: 3px solid var(--warn); }
.late-pill { font-size: 11.5px; font-weight: 700; color: #b3303d; background: #f2cdd1; border-radius: 99px; padding: 2px 8px; }
.today-empty { padding: 10px 2px; list-style: none; }
@media (max-width: 1000px) { .today-grid { grid-template-columns: 1fr; } }

/* Evento terminado */
.finish-bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding: 18px 20px; border: 1.5px dashed var(--border-2); border-radius: var(--radius); margin-top: 8px; }
.finish-bar.done { border-style: solid; border-color: #e6cf98; background: #f9eed3; }
.finish-btn { background: var(--ok); border-color: var(--ok); color: #0f1115; font-size: 15px; padding: 10px 18px; }
.finished-banner { background: #f9eed3; border: 1px solid #e6cf98; color: #6f4d0f; border-radius: 12px; padding: 10px 14px; margin-bottom: 12px; }
.card.finished { opacity: .75; }
.card.finished:hover { opacity: 1; }
details.finished-group > summary { list-style: none; cursor: pointer; }
details.finished-group > summary::-webkit-details-marker { display: none; }
details.finished-group[open] > summary .phase-chev { transform: rotate(90deg); }

/* Trofeos: bolitas */
.ball { display: inline-block; border-radius: 50%; border: none; padding: 0; flex: none; vertical-align: middle; }
button.ball { cursor: pointer; transition: transform .15s; }
button.ball:hover, button.ball:focus-visible { transform: scale(1.25); outline: none; }
button.ball:focus-visible { box-shadow: 0 0 0 3px var(--text); }
.ball-task { width: 16px; height: 16px; background: radial-gradient(circle at 35% 30%, #a6f5cc, #3ccf91 55%, #1f8f5f); }
.ball-deliv { width: 30px; height: 30px; background: radial-gradient(circle at 35% 30%, #c9d4ff, #6c8cff 55%, #3a54c4); }
.ball-event { width: 54px; height: 54px; background: radial-gradient(circle at 35% 30%, #fff1b8, #f7c948 55%, #b8860b); box-shadow: 0 0 18px rgba(247, 201, 72, .35); }
.ball.mini { width: 12px; height: 12px; box-shadow: none; }
.trophy-legend { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.trophy-legend > span { display: inline-flex; align-items: center; gap: 6px; }
.trophy-legend .ball-deliv { width: 20px; height: 20px; }
.trophy-legend .ball-event { width: 28px; height: 28px; }
.trophy-month { padding: 16px 18px; }
.trophy-month h3 { font-size: 16px; margin-bottom: 14px; }
.vitrina { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.trophy-detail { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; }
.trophy-detail .modal-actions { margin-top: 10px; }
.big-preview.ball-task { width: 40px; height: 40px; }
.big-preview.ball-deliv { width: 56px; height: 56px; }
.big-preview.ball-event { width: 80px; height: 80px; }


/* Pecera de trofeos */
.bowl-block { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 10px; align-items: center; }
.bowl-wrap { position: relative; width: 100%; display: flex; justify-content: center; }
.bowl-canvas { display: block; max-width: 100%; touch-action: pan-y; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.bowl-canvas.grabbing { cursor: grabbing; }
.bowl-tip {
  position: absolute; transform: translate(-50%, -100%); pointer-events: none; white-space: nowrap;
  background: var(--card-2); border: 1px solid var(--border-2); border-radius: 10px; padding: 6px 10px;
  font-size: 12.5px; box-shadow: 0 8px 22px rgba(60, 45, 20, .22); display: flex; gap: 6px; align-items: center; max-width: 90%;
}
.bowl-tip b { overflow: hidden; text-overflow: ellipsis; max-width: 260px; }
.bowl-tip span { color: var(--muted); }
.recent-block { padding: 14px 16px; }
.recent-block h3 { font-size: 15px; margin-bottom: 10px; }
.recent-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.recent-item { width: 100%; display: flex; align-items: center; gap: 10px; text-align: left; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; cursor: pointer; }
.recent-item:hover { border-color: var(--accent); }
.today-count { display: inline-grid; place-items: center; min-width: 24px; height: 22px; padding: 0 7px; margin-left: 4px; border-radius: 99px; background: var(--chip, rgba(255,255,255,.08)); font-size: 12.5px; font-weight: 700; vertical-align: middle; }
.today-count.neg { background: rgba(255,95,109,.18); color: #b3303d; }
/* Especificaciones: tarjetas a todo el ancho, datos en columnas */
.spec-cards { grid-template-columns: 1fr; }
.spec-card .rows { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px 32px; }
.spec-card .rows > div { border-bottom: 1px dashed var(--border); padding-bottom: 6px; }
/* Tareas y pasos acomodado debajo de las notas del acercamiento */
.ap-tasks-slot:empty { display: none; }
.ap-tasks-slot > .module.docked { margin: 0; width: 100%; box-shadow: none; }
.ap-tasks-slot .st-chips { flex-wrap: wrap; }
/* Tareas propias de cada pestaña de Producción */
.tab-tasks { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.tab-tasks-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.prod-tab-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.today-h { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.today-h .today-add { margin-left: auto; }
.today-form label { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: var(--muted); }
/* Calendario: filtros en menú desplegable */
.filter-dd { position: relative; margin-bottom: 12px; width: fit-content; }
.filter-dd > summary { list-style: none; cursor: pointer; display: inline-flex; gap: 8px; align-items: center; }
.filter-dd > summary::-webkit-details-marker { display: none; }
.filter-dd-menu { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; display: flex; gap: 24px; flex-wrap: wrap; padding: 14px 16px; background: var(--panel, #1a1d24); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 12px 30px rgba(0,0,0,.4); min-width: 280px; max-width: min(620px, 92vw); max-height: 70vh; overflow: auto; }
.fd-col { display: flex; flex-direction: column; gap: 6px; min-width: 200px; }
.fd-item { display: flex; align-items: center; gap: 8px; font-size: 13.5px; cursor: pointer; padding: 3px 0; }
.fd-item .pdot { width: 9px; height: 9px; border-radius: 50%; background: var(--pc); display: inline-block; }
.link-btn { background: none; border: 0; color: #3d3830; cursor: pointer; font-size: 12px; padding: 0; }
/* Especificaciones: tarjetas una al lado de la otra, anchas */
.spec-cards { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.spec-card .rows { display: flex; flex-direction: column; gap: 8px; }
.spec-card .rows > div { border-bottom: 0; padding-bottom: 0; }
/* Mi equipo */
#my-gear { margin-top: 18px; scroll-margin-top: 110px; }
.my-gear h3 { margin: 0; }
.mg-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.mg-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px 22px; margin-top: 12px; }
.mg-list { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.mg-list li { display: flex; align-items: center; gap: 6px; }
.mg-name { flex: 1; min-width: 0; background: transparent; border-color: transparent; padding: 4px 6px; }
.mg-name:hover, .mg-name:focus { border-color: var(--border); }
.mg-list .g-qty-in { width: 56px; }
.gear-head-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.gear-modal { width: min(760px, 94vw); }
.gear-pick .mg-cats { max-height: 60vh; overflow: auto; }
/* Estado del guardado en la nube */
.sync-status { display: flex; gap: 6px; align-items: center; font-size: 12px; color: var(--muted); padding: 4px 12px 8px; }
.sync-status[data-kind="offline"] { color: #b0611a; }
/* Fecha en la línea de entregables */
.dv-date { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); }
.dv-date input { min-width: 140px; }
/* Diagnóstico largo: fecha indefinida o concreta, y equipo de la base */
.due-pick, .team-pick { display: flex; flex-direction: column; gap: 6px; }
.field-l { font-size: 12.5px; color: var(--muted); }
.due-seg { width: fit-content; }
.team-checks { display: flex; flex-wrap: wrap; gap: 8px; }
.chip-check { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--border); border-radius: 99px; cursor: pointer; font-size: 13.5px; }
.chip-check:has(input:checked) { border-color: var(--accent); background: rgba(108,140,255,.14); }
.diag-form .chip-check { flex-direction: row; align-items: center; gap: 6px; color: var(--text); }
.diag-form .chip-check input { width: auto; margin: 0; }
.due-seg label span { white-space: nowrap; }
/* Entregable entregado: tarjeta verde */
.dv-card.st-entregado { border-color: #1f9d63; background: rgba(60, 207, 145, .13); }
.dv-card.st-entregado .dv-name { text-decoration: none; color: inherit; }
.dv-card.st-entregado .dv-name::after { content: ' ✓'; color: #1f9d63; }
.deliv-toggle { width: 100%; margin-top: 14px; justify-content: center; border-color: #1f9d63; color: #1f9d63; }
.deliv-toggle.is-done { background: rgba(60, 207, 145, .15); }
/* Inventario: una tarjeta larga por equipo */
.inventory { display: flex; flex-direction: column; gap: 18px; }
.inv-add h3 { margin: 0 0 10px; }
.inv-add .add-row { flex-wrap: wrap; }
.inv-add [name=name] { flex: 1 1 220px; }
.inv-add [name=qty] { width: 80px; }
.inv-cat-h { margin: 0 0 8px; font-size: 15px; display: flex; gap: 8px; align-items: center; }
.inv-cards { display: flex; flex-direction: column; gap: 8px; }
.inv-card { display: flex; align-items: center; gap: 12px; padding: 12px 10px 12px 16px; background: var(--panel); border: 1px solid var(--border); border-radius: 12px; }
.inv-card.flash { border-color: var(--accent); }
.inv-icon { font-size: 18px; width: 26px; text-align: center; }
.inv-name { flex: 1; font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.inv-qty { font-size: 12.5px; font-weight: 700; padding: 2px 9px; border-radius: 99px; background: rgba(0,0,0,.06); }
.inv-menu { margin-left: 4px; font-size: 18px; }
/* Inventario: más aire entre elementos y con los bordes */
.inventory { gap: 26px; }
.inv-add { padding: 20px 24px 18px; }
.inv-add h3 { margin: 0 0 14px; font-size: 16px; }
.inv-add .add-row { gap: 12px; }
.inv-add .add-row > * { min-height: 42px; }
.inv-add p { margin: 12px 0 0; }
.inv-cat + .inv-cat { margin-top: 6px; }
.inv-cat-h { margin: 0 0 12px 4px; }
.inv-cards { gap: 10px; }
.inv-card { padding: 14px 14px 14px 20px; gap: 14px; }
/* Iniciales del proyecto dentro de las bolitas (vista Alineadas) */
.vitrina .ball { display: inline-grid; place-items: center; }
.vitrina .ball-task { width: 26px; height: 26px; }
.ball-ini { font-weight: 800; color: rgba(12, 18, 30, .78); line-height: 1; pointer-events: none; }
.ball-task .ball-ini { font-size: 11px; }
.ball-deliv .ball-ini { font-size: 13px; }
.ball-event .ball-ini { font-size: 20px; }
.ball-ini[data-n="3"] { letter-spacing: -.5px; transform: scale(.85); }
/* Diagnóstico: objetivos e integrantes como tarjetas */
.goals-pick { display: flex; flex-direction: column; gap: 8px; }
.goal-list { display: flex; flex-direction: column; gap: 8px; }
.goal-card { display: flex; align-items: center; gap: 12px; padding: 10px 12px 10px 14px; border: 1px solid var(--border); border-radius: 10px; background: rgba(0,0,0,.025); }
.goal-n { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: rgba(108,140,255,.18); color: #3d3830; font-size: 12px; font-weight: 800; flex: none; }
.goal-general { margin: 4px 0 14px; padding: 12px 16px; border-left: 3px solid var(--accent); background: rgba(108,140,255,.08); border-radius: 0 10px 10px 0; }
.goal-general p { margin: 4px 0 0; font-weight: 600; }
.member-add .m-name { flex: 1 1 180px; }
.member-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; margin-top: 4px; }
.member-card { display: flex; align-items: center; gap: 12px; padding: 12px 12px 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: rgba(0,0,0,.025); }
.mc-avatar { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: rgba(60,207,145,.18); color: #18784b; font-weight: 800; flex: none; }
.mc-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.mc-info a, .mc-info span { overflow-wrap: anywhere; }
.inv-add [name=qty] { flex: 0 0 90px; width: 90px; }

/* ---------- Tema claro (beige) ---------- */
.card, .block, .modal, .inv-card, .goal-card, .member-card { box-shadow: 0 1px 2px rgba(60, 45, 20, .06); }
::selection { background: #dfe5fb; }

/* ---------- Cuestionario por voz ---------- */
.voice-modal { width: min(560px, 100%); }
.vq-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.vq-bar { height: 5px; background: var(--card-2); border-radius: 9px; margin: 10px 0 16px; overflow: hidden; }
.vq-bar span { display: block; height: 100%; background: var(--accent); border-radius: 9px; transition: width .25s; }
.vq-q { font-size: 19px; line-height: 1.3; }
.vq-hint { margin: 6px 0 12px; }
.vq-input { display: flex; gap: 10px; align-items: flex-start; }
.vq-input textarea { flex: 1; font-size: 15px; }
.vq-mic { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; width: 72px; height: 72px; border-radius: 50%; border: 0; background: var(--accent); color: #fff; cursor: pointer; box-shadow: 0 2px 8px rgba(28, 26, 23, .25); }
.vq-mic-i { font-size: 24px; line-height: 1; }
.vq-mic-l { font-size: 11px; font-weight: 700; }
.vq-mic.on { background: var(--danger); box-shadow: none; animation: vq-pulse 1.2s infinite; }
@keyframes vq-pulse { 0% { box-shadow: 0 0 0 0 rgba(208, 65, 79, .45); } 100% { box-shadow: 0 0 0 16px rgba(208, 65, 79, 0); } }
.vq-live { display: flex; align-items: center; gap: 8px; margin: 10px 0 0; font-size: 13px; font-weight: 600; color: var(--danger); }
.vq-live[hidden] { display: none; }
.vq-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--danger); animation: vq-blink 1s infinite; flex: none; }
.vq-live.err .vq-dot { animation: none; }
@keyframes vq-blink { 50% { opacity: .25; } }
.vq-got { min-height: 22px; margin: 10px 0 4px; color: var(--ok); }
.vq-got b { color: var(--text); }
@media (max-width: 560px) { .vq-q { font-size: 17px; } .vq-mic { width: 64px; height: 64px; } }

/* ---------- Instalar app ---------- */
.install-modal { width: min(420px, 100%); }
.install-steps { text-align: left; }
.install-icon { width: 64px; height: 64px; border-radius: 15px; display: block; margin: 0 auto 12px; box-shadow: 0 4px 14px rgba(60, 45, 20, .18); }
.install-steps h3 { text-align: center; margin-bottom: 12px; }
.install-steps ol { padding-left: 20px; margin: 0 0 6px; line-height: 1.6; }
.install-steps li { margin-bottom: 6px; }
.ios-share { display: inline-grid; place-items: center; width: 22px; height: 22px; border: 1.5px solid var(--accent); border-radius: 5px; color: var(--accent); font-size: 12px; }
/* App instalada en iPhone: respeta la zona de la barra superior y la de abajo */
@supports (padding: env(safe-area-inset-top)) {
  .sidebar { padding-top: max(14px, env(safe-area-inset-top)); padding-bottom: max(14px, env(safe-area-inset-bottom)); }
  .sb-open { top: max(14px, env(safe-area-inset-top)); }
  .main { padding-bottom: env(safe-area-inset-bottom); }
}

/* ---------- Dictar especificaciones ---------- */
.spec-block-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.spec-block-h .sub-label { margin: 0; }
.btn.sm { padding: 5px 11px; font-size: 12.5px; border-radius: 8px; }
.dict-btn { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.sv-got { margin-top: 12px; }
.sv-got .rows { margin: 6px 0 0; }

/* ---------- Módulo Inventario del proyecto ---------- */
.gm-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.gm-cat { margin-bottom: 12px; }
.gm-cat .sub-label { margin-bottom: 6px; }
.gm-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--card); margin-bottom: 6px; }
.gm-item.ready { background: color-mix(in srgb, var(--ok) 10%, var(--card)); border-color: color-mix(in srgb, var(--ok) 40%, var(--border)); }
.gm-item.ready .grow { text-decoration: line-through; color: var(--muted); }
.gm-check { display: flex; }

/* ---------- Celular: la lista de equipos de Producción como tarjetas ---------- */
@media (max-width: 700px) {
  .gear-cat .gear-table, .gear-table tbody { display: block; table-layout: auto; }
  .gear-table thead { display: none; }
  .gear-table tr {
    display: grid; grid-template-columns: 78px 1fr 1fr 70px; grid-template-areas: 'pk name name del' 'qty own own ret';
    gap: 8px 10px; align-items: center; padding: 12px 2px; border-bottom: 1px solid var(--border);
  }
  .gear-table td { display: block; padding: 0; border: 0; min-width: 0; }
  .gear-table td:nth-child(1) { grid-area: pk; }
  .gear-table td:nth-child(2) { grid-area: name; font-size: 14px; overflow-wrap: anywhere; }
  .gear-table td:nth-child(3) { grid-area: qty; }
  .gear-table td:nth-child(4) { grid-area: own; }
  .gear-table td:nth-child(5) { grid-area: ret; }
  .gear-table td:nth-child(6) { grid-area: del; justify-self: end; }
  .gear-table td[data-l]::before { content: attr(data-l); display: block; font-size: 11px; color: var(--muted); margin-bottom: 4px; }
  .gear-table td:nth-child(2)::before, .gear-table td:nth-child(1)::before { display: none; }
  .gear-table td:nth-child(1) { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
  .gear-table td:nth-child(1)::after { content: 'Empacado'; }
  .gear-table input:not([type=checkbox]), .gear-table select { width: 100%; }
}

/* ---------- Menú lateral: siempre se puede bajar hasta el final ---------- */
.sidebar { height: 100vh; height: 100dvh; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.sidebar .sb-nav, .sidebar .sb-head, .sidebar .sb-foot { flex-shrink: 0; }
@media (max-width: 900px) {
  .sidebar { height: auto; max-height: 100dvh; }
}


/* ===== Marca Rowly Studio ===== */
h1, h2, .sb-name { font-family: var(--f-display); font-weight: 400; letter-spacing: .04em; }
h1 { letter-spacing: .06em; }
.sidebar { background: var(--ink); border-right-color: #23201c; color: var(--bone); }
/* Dashboards personales (Sara, Davos, Yanis): letra más grande y legible */
.vista-persona .sidebar .sb-link { font-size: 17px; }
.vista-persona .sidebar .sb-link.small { font-size: 15px; }
.vista-persona .sb-persona { font-size: 22px; }
.vista-persona .btn, .vista-persona .view-seg button { font-size: 16px; }
.sidebar .sb-head { border-bottom-color: #2a2622; }
.sidebar .sb-link { color: var(--stone); }
.sidebar .sb-link:hover { background: #1d1b18; color: var(--bone); }
.sidebar .sb-link.on { background: #24211d; color: var(--bone); }
.sidebar .icon-btn { color: var(--stone); }
.sidebar .sync-status { color: var(--stone); }
.brand-mark { background: var(--ink); overflow: hidden; }
.brand-mark img { width: 78%; height: auto; display: block; }
.sb-head .brand-mark { background: transparent; width: 40px; height: 40px; }
.sb-name { font-weight: 300; letter-spacing: .38em; font-size: 16px; }
.sb-sub { color: var(--stone); }
.btn.primary { letter-spacing: .02em; }

/* ===== Solicitudes (formulario de la página pública) ===== */
.sb-count { margin-left: auto; background: var(--bone); color: var(--ink); font-size: 11px; font-weight: 700; border-radius: 999px; padding: 1px 7px; }
.ld-page { display: grid; gap: 12px; max-width: 920px; }
.ld-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px 18px; display: grid; gap: 10px; }
.ld-top { display: flex; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.ld-top h3 { font-size: 16px; font-weight: 600; }
.ld-msg { margin: 0; white-space: pre-wrap; line-height: 1.55; }
.ld-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ld-status { font-weight: 600; font-size: 13px; padding: 5px 9px; }
.ld-status.ld-new { background: #f9eed3; border-color: #e6cf98; color: #6f4d0f; }
.ld-status.ld-contact { background: #dce5fa; border-color: #b9c8ef; color: #2c58bd; }
.ld-status.ld-prop { background: var(--accent-soft); color: var(--text); }
.ld-status.ld-won { background: #d6f1e3; border-color: #a9dcc1; color: #18784b; }
.ld-status.ld-lost { background: var(--card-2); color: var(--muted); }

/* ---------- Propuestas: elegir audiovisual o marketing ---------- */
.area-pick { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 14px; }
.area-btn { display: grid; gap: 4px; justify-items: start; text-align: left; padding: 16px 18px; border-radius: 12px; border: 1px solid var(--border-2); background: var(--panel); color: var(--text); font: inherit; cursor: pointer; }
.area-btn b { font-size: 16px; }
.area-btn small { color: var(--muted); font-size: 13px; line-height: 1.35; }
.area-btn.on { border-color: var(--accent); background: var(--accent-soft); }
.area-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.area-ic { font-size: 22px; }
.pr-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.pr-tiles { margin-top: 14px; gap: 10px; }
.pr-tiles li { padding: 10px 12px; }
.pr-page { gap: 22px; padding-top: 28px; }
.pr-page .block { padding: 18px 20px; gap: 14px; }
.pr-page .sum-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.pr-head { margin-bottom: 2px; }
.pr-head-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.q-tiles { margin-top: 4px; gap: 10px; }
.q-tiles li.editable { cursor: pointer; }
.q-tiles li.editable:hover { border-color: var(--accent); }
.mk-danger { display: flex; justify-content: flex-end; margin-top: 28px; padding-top: 18px; border-top: 1px solid var(--border); }
.pr-doc-fold { padding: 16px 20px; }
.pr-doc-fold > summary { cursor: pointer; font-weight: 600; list-style: none; display: flex; align-items: center; gap: 8px; }
.pr-doc-fold > summary::before { content: "▾"; color: var(--muted); transition: transform .15s; display: inline-block; }
.pr-doc-fold:not([open]) > summary::before { transform: rotate(-90deg); }
.pr-doc-fold .pp-doc { margin-top: 14px; box-shadow: 0 1px 4px rgba(0, 0, 0, .08); }
.field-edit { display: grid; gap: 12px; }
.prop-card-end { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.card-trash { font-size: 15px; opacity: .65; }
.card-trash:hover { opacity: 1; color: #b4545d; }
.quote-filters { display: flex; gap: 14px; flex-wrap: wrap; }
.quote-filters label { display: grid; gap: 6px; font-size: 13px; min-width: 200px; }

/* Cotizaciones: grupos por estado (naranja pendientes, verde aceptadas, rojo rechazadas) */
.quote-group { --qg: #c4661c; --qg-bg: #fdf1e4; --qg-ink: #8f4a12; margin-top: 18px; border: 1px solid var(--border); border-left: 5px solid var(--qg); border-radius: 14px; background: var(--panel); }
.quote-group.qg-acep { --qg: #1f8a5b; --qg-bg: #e4f6ec; --qg-ink: #17663f; }
.quote-group.qg-rech { --qg: #b8404d; --qg-bg: #fbe6e8; --qg-ink: #8f2c37; }
.quote-group > summary { list-style: none; cursor: pointer; user-select: none; display: flex; align-items: center; gap: 8px; padding: 12px 16px; font-weight: 700; font-size: 15px; color: var(--qg-ink); }
.quote-group > summary::-webkit-details-marker { display: none; }
.qg-chev { display: inline-block; font-size: 11px; opacity: .6; transition: transform .15s; }
.quote-group[open] > summary .qg-chev { transform: rotate(90deg); }
.qg-count { margin-left: auto; font-size: 12px; font-weight: 700; padding: 2px 10px; border-radius: 999px; background: var(--qg-bg); color: var(--qg-ink); }
.quote-group > .prop-grid { padding: 0 14px 14px; }
.qg-empty { padding: 0 16px 14px; margin: 0; }
.prop-card.qc { background: var(--qg-bg); border: 1px solid var(--qg); border-radius: 12px; padding: 14px 16px; gap: 6px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.prop-card.qc:hover, .prop-card.qc:focus-visible { border-color: var(--qg); box-shadow: 0 8px 20px -12px var(--qg); }
.qc-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.qc-title { font-size: 15px; line-height: 1.3; color: var(--qg-ink); }
.qc-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.prop-card.qc .badge { background: var(--qg); color: #fff; }
.prop-card.qc .dv-tag { background: #fff; color: var(--qg-ink); }
.prop-card.qc .prop-total { color: var(--qg-ink); margin-top: 8px; }
.prop-card.qc .card-trash { color: var(--qg-ink); }
.pr-ask { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; border-color: var(--accent); }
.pr-ask-text { display: grid; gap: 4px; }
.trash-box { padding: 16px 20px; }
.trash-box > summary { cursor: pointer; font-weight: 600; list-style: none; display: flex; align-items: center; gap: 8px; }
.trash-list { list-style: none; padding: 0; margin: 12px 0 0; display: grid; gap: 10px; }
.trash-list li { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 0; border-top: 1px solid var(--border); }
.q-tiles li { padding: 10px 12px; }
.q-grid { gap: 14px 16px; }
.quote-actions { gap: 12px; flex-wrap: wrap; }
.quote-send { display: grid; gap: 10px; margin-top: 16px; padding: 16px; border: 1px solid var(--border); border-radius: 12px; }
.quote-send label { display: grid; gap: 6px; font-size: 13px; }
.quote-send-actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.pr-foot { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; }
.pr-total { display: grid; gap: 2px; }
.pr-total b { font-size: 24px; font-variant-numeric: tabular-nums; }
@media (max-width: 560px) { .area-pick { grid-template-columns: 1fr; } }

/* Marca: ROWLY con STUDIO debajo */
.sb-studio { display: block; font-size: 9px; letter-spacing: .6em; color: var(--stone); margin-top: 3px; font-weight: 400; }
.sb-home-t .sb-name { flex: none; line-height: 1.15; }
.sb-home-t .sb-sub { margin-top: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ===== Hoy: tablero por bloques ===== */
.hoy-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.hoy-wide { grid-column: 1 / -1; }
.hoy-block { padding: 16px 18px; min-width: 0; }
.hoy-block h3 { font-size: 16px; margin-bottom: 12px; }
.hoy-sub { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 12px 0 6px; font-weight: 700; }
.hoy-sub:first-of-type { margin-top: 0; }
.hoy-mini { font-size: 11.5px; color: var(--muted); margin: 8px 0 4px; font-weight: 600; }
.hoy-empty { font-size: 13px; margin: 4px 2px 8px; }
.hoy-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.hoy-list.soon .hoy-row { background: transparent; border-style: dashed; }
.hoy-row { display: flex; align-items: center; gap: 10px; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; }
.hoy-row .grow { flex: 1; min-width: 0; }
.hoy-row .grow b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hoy-row.late { border-left: 3px solid var(--danger); }
.hoy-row.done b { text-decoration: line-through; color: var(--muted); }
.hoy-time { font-weight: 700; font-size: 13px; min-width: 46px; text-align: center; line-height: 1.2; }
.hoy-check { width: 18px; height: 18px; flex: none; accent-color: #2f6fd6; cursor: pointer; margin: 0; }
.hoy-owners { display: inline-flex; flex: none; }
.hoy-av { width: 22px; height: 22px; border-radius: 50%; background: var(--av); color: #fff; font-size: 11px; font-weight: 700; display: grid; place-items: center; border: 2px solid var(--panel, #fff); margin-left: -6px; }
.hoy-av:first-child { margin-left: 0; }
.hoy-legend { margin-left: auto; display: inline-flex; gap: 10px; align-items: center; font-size: 12px; font-weight: 500; color: var(--muted); }
.hoy-legend i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; margin-right: -6px; }
.hoy-legend i.ok { background: #2f6fd6; } .hoy-legend i.late { background: var(--danger); }
.hoy-deliv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); grid-auto-rows: 116px; gap: 10px; }
.hoy-deliv { position: relative; height: 116px; min-width: 0; overflow: hidden; border-radius: 12px; padding: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; text-align: center; cursor: pointer; color: #fff; transition: transform .12s, box-shadow .12s; }
.hoy-deliv.ok { background: #2f6fd6; } .hoy-deliv.late { background: var(--danger); }
.hoy-deliv:hover, .hoy-deliv:focus-visible { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,.18); outline: none; }
.hoy-deliv .hoy-check { position: absolute; top: 7px; left: 7px; accent-color: #fff; }
.hoy-deliv-ic svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; display: block; }
.hoy-deliv-ic.sm svg { width: 20px; height: 20px; }
.hoy-deliv-ic.sm.ok { color: #2f6fd6; } .hoy-deliv-ic.sm.late { color: var(--danger); }
.hoy-deliv-c { font-size: 12.5px; line-height: 1.2; max-width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.hoy-deliv-late { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; opacity: .9; }
.hoy-deliv .hoy-av { border-color: rgba(255,255,255,.85); width: 20px; height: 20px; font-size: 10px; }
.hoy-modal-h { display: flex; align-items: center; gap: 8px; }
.hoy-dl { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; margin: 6px 0 14px; font-size: 14px; }
.hoy-dl dt { color: var(--muted); } .hoy-dl dd { margin: 0; font-weight: 600; }
.hoy-pay { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
.hoy-paycol { min-width: 0; }
.hoy-amt { font-size: 13px; white-space: nowrap; } .hoy-amt.in { color: #1f8a5b; } .hoy-amt.out { color: var(--danger); }
.hoy-done { margin-top: 12px; border-top: 1px solid var(--border); padding-top: 8px; }
.hoy-done summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--muted); padding: 4px 0; }
.hoy-done .hoy-list { margin-top: 6px; }
@media (max-width: 1000px) { .hoy-grid { grid-template-columns: 1fr; } }
@media (max-width: 520px) {
  .hoy-pay { grid-template-columns: 1fr; }
  .hoy-deliv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 108px; gap: 8px; }
  .hoy-deliv { height: 108px; }
  .hoy-block { padding: 14px 12px; }
}

.hoy-scroll { max-height: 340px; overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; margin-right: -4px; scrollbar-width: thin; }
.hoy-wide .hoy-scroll { max-height: 380px; }
.hoy-done .hoy-list { max-height: 200px; overflow-y: auto; scrollbar-width: thin; }
.hoy-deliv-c { display: -webkit-box; }
.hoy-more { flex: none; font-size: 18px; line-height: 1; padding: 4px 8px; }
.view-toggle { display: inline-flex; background: var(--panel); border: 1px solid var(--border); border-radius: 99px; padding: 3px; gap: 2px; }
.view-toggle a { padding: 6px 14px; border-radius: 99px; font-size: 13px; font-weight: 600; color: var(--muted); text-decoration: none; white-space: nowrap; }
.view-toggle a.on { background: var(--accent); color: #fff; }
.view-toggle a:not(.on):hover { color: var(--text); }
.cal-nav .view-toggle { margin-right: 10px; }

/* ===== Menú: grupo desplegable (Proyectos) ===== */
.sb-group { width: 100%; background: none; border: none; cursor: pointer; text-align: left; font: inherit; }
.sb-caret { margin-left: auto; font-size: 12px; transition: transform .15s; transform: rotate(-90deg); opacity: .7; }
.sb-group.open .sb-caret { transform: none; }
.sb-sub-nav { display: flex; flex-direction: column; gap: 2px; padding-left: 14px; }
.sb-sub-nav[hidden] { display: none; }
.sb-child { font-size: 14px; }

/* ===== Marketing ===== */
.mk-main { display: flex; flex-direction: column; gap: 16px; }
.mk-rail-wrap { position: relative; }
.mk-rail { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x proximity; padding: 4px 2px 10px; scrollbar-width: none; }
.mk-rail::-webkit-scrollbar { display: none; }
.mk-card { flex: 0 0 210px; scroll-snap-align: start; background: var(--panel); border: 1px solid var(--border); border-radius: 18px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 2px 8px rgba(0,0,0,.05); }
.mk-photo { position: relative; height: 270px; background: radial-gradient(120% 90% at 30% 20%, color-mix(in srgb, var(--cc) 70%, #fff), var(--cc) 60%, color-mix(in srgb, var(--cc) 70%, #000)); color: #fff; display: grid; place-items: center; }
.mk-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mk-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,.25), transparent 30%, transparent 55%, rgba(0,0,0,.55)); pointer-events: none; }
.mk-letter { font-family: Montserrat, sans-serif; font-size: 96px; font-weight: 800; opacity: .9; line-height: 1; }
.mk-owner { position: absolute; top: 12px; right: 12px; z-index: 1; display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; background: rgba(0,0,0,.35); padding: 3px 10px 3px 3px; border-radius: 99px; backdrop-filter: blur(4px); }
.mk-owner .hoy-av { width: 20px; height: 20px; font-size: 10px; border-color: rgba(255,255,255,.8); }
.mk-flag { position: absolute; top: 12px; left: 12px; z-index: 1; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; padding: 3px 8px; border-radius: 99px; background: #fff; }
.mk-flag.deuda { color: #b3303d; } .mk-flag.pendiente { color: #a8701a; }
.mk-name { position: absolute; left: 14px; right: 14px; bottom: 12px; z-index: 1; margin: 0; font-size: 18px; line-height: 1.2; color: #fff; text-shadow: 0 1px 6px rgba(0,0,0,.4); }
.mk-cat { padding: 10px 14px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); border-top: 1px solid var(--border); }
.mk-arrow { position: absolute; top: 50%; transform: translateY(-60%); z-index: 2; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border); background: var(--panel); box-shadow: 0 4px 14px rgba(0,0,0,.15); font-size: 24px; line-height: 1; cursor: pointer; color: var(--text); }
.mk-arrow.prev { left: -12px; } .mk-arrow.next { right: -12px; }
.mk-arrow:disabled { opacity: 0; pointer-events: none; }
.mk-sec { padding: 0; overflow: hidden; }
.mk-sum { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 14px 18px; font-size: 16px; font-weight: 700; }
.mk-sum::-webkit-details-marker { display: none; }
.mk-sum::before { content: '▸'; font-size: 13px; color: var(--muted); transition: transform .15s; }
details[open] > .mk-sum::before { transform: rotate(90deg); }
.mk-sum .today-add { margin-left: auto; }
.mk-filters { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 18px 12px; align-items: center; }
.mk-filters input, .mk-filters select { font: inherit; font-size: 13px; padding: 6px 9px; border: 1px solid var(--border); border-radius: 8px; background: var(--panel); color: var(--text); min-width: 0; }
.mk-filters input[type=search] { flex: 1 1 180px; }
.mk-range { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.mk-scroll { max-height: 380px; overflow: auto; padding: 0 18px 16px; scrollbar-width: thin; }
.mk-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.mk-table th { position: sticky; top: 0; background: var(--card, #f6f2ea); text-align: left; font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); padding: 8px 10px; z-index: 1; }
.mk-table td { padding: 9px 10px; border-top: 1px solid var(--border); vertical-align: middle; }
.mk-table tr.late td:first-child { box-shadow: inset 3px 0 var(--danger); }
.mk-table tr.done b { text-decoration: line-through; color: var(--muted); }
.mk-ck { width: 30px; }
.mk-date { white-space: nowrap; }
.mk-none { text-align: center; padding: 20px !important; }
.mk-who { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.mk-prio, .mk-st, .mk-bill-st { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 99px; white-space: nowrap; }
.mk-prio.alta { background: #f9dcdf; color: #b3303d; } .mk-prio.media { background: #f6ead2; color: #8a5a10; } .mk-prio.baja { background: #e3eee8; color: #1f6b47; }
.mk-st.pendiente { background: #ece8e1; color: #5d564c; } .mk-st.en-curso { background: #dde8fa; color: #2457a8; }
.mk-st.retrasada { background: var(--danger); color: #fff; } .mk-st.hecha { background: #e3eee8; color: #1f6b47; }
.mk-bill-st.activo { background: #dff1e7; color: #1f6b47; } .mk-bill-st.pendiente { background: #f6ead2; color: #8a5a10; } .mk-bill-st.deuda { background: var(--danger); color: #fff; }
.mk-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.mk-today { border-left: 3px solid #2f6fd6; }
.mk-colors { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.mk-color input { position: absolute; opacity: 0; }
.mk-color span { display: block; width: 28px; height: 28px; border-radius: 50%; background: var(--cc); cursor: pointer; border: 3px solid transparent; }
.mk-color input:checked + span { border-color: var(--text); box-shadow: inset 0 0 0 2px #fff; }
.mk-soon { padding: 20px; display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
@media (max-width: 1100px) { .mk-two { grid-template-columns: 1fr; } }
@media (max-width: 700px) {
  .mk-card { flex-basis: 70%; }
  .mk-photo { height: 240px; }
  .mk-arrow { display: none; }
  .mk-filters { padding: 0 12px 10px; }
  .mk-filters select, .mk-range { flex: 1 1 45%; }
  .mk-scroll { padding: 0 12px 12px; }
  .mk-table thead { display: none; }
  .mk-table, .mk-table tbody, .mk-table tr, .mk-table td { display: block; width: 100%; }
  .mk-table tr { border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; margin-bottom: 8px; position: relative; background: var(--panel); }
  .mk-table td { border: none; padding: 3px 0; display: flex; gap: 8px; align-items: center; }
  .mk-table td[data-l]::before { content: attr(data-l); font-size: 11px; color: var(--muted); min-width: 86px; text-transform: uppercase; letter-spacing: .04em; }
  .mk-table td.mk-ck { position: absolute; top: 8px; right: 6px; width: auto; }
  .mk-table tr.late { border-left: 3px solid var(--danger); }
  .mk-table tr.late td:first-child { box-shadow: none; }
}
.mk-sum > span { white-space: nowrap; }
@media (max-width: 700px) { .mk-sum { flex-wrap: wrap; padding: 12px 14px; } .mk-table td:nth-child(2) { padding-right: 28px; } }
.mk-done { border-top: 1px solid var(--border); margin: 0 0 4px; }
.mk-done > summary { list-style: none; cursor: pointer; padding: 12px 18px; font-size: 14px; font-weight: 700; color: var(--muted); display: flex; align-items: center; gap: 8px; }
.mk-done > summary::-webkit-details-marker { display: none; }
.mk-done > summary::before { content: '▸'; font-size: 12px; transition: transform .15s; }
.mk-done[open] > summary::before { transform: rotate(90deg); }
.mk-done .mk-scroll { max-height: 260px; }
.mk-done .mk-table td { color: var(--muted); }
.hoy-fold { margin-top: 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--card, transparent); }
.hoy-fold > summary { list-style: none; cursor: pointer; padding: 11px 14px; font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.hoy-fold > summary::-webkit-details-marker { display: none; }
.hoy-fold > summary::before { content: '▸'; font-size: 12px; color: var(--muted); transition: transform .15s; }
.hoy-fold[open] > summary::before { transform: rotate(90deg); }
.hoy-fold > .hoy-scroll { padding: 0 12px 12px; max-height: 360px; }
.hoy-tk-date { font-size: 12px; font-weight: 700; color: var(--muted); white-space: nowrap; }
.hoy-tk-date.late { color: var(--danger); }
.hoy-task .grow b { white-space: normal; }
@media (max-width: 520px) { .hoy-task { flex-wrap: wrap; } .hoy-task .hoy-tk-date { margin-left: 28px; } }

/* ===== Hoy: tareas en columnas (tarea · cliente · responsable · entrega) ===== */
.tk-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.tk-head, .tk-row { display: grid; grid-template-columns: 28px minmax(0, 2.2fr) minmax(0, 1.2fr) minmax(0, 1.4fr) minmax(0, 0.9fr); gap: 10px; align-items: center; }
.tk-head { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; padding: 2px 12px 6px; }
.tk-row { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 9px 12px; font-size: 13.5px; }
.tk-row.late { border-left: 3px solid var(--danger); }
.tk-row.done .tk-title { text-decoration: line-through; color: var(--muted); }
.tk-row .hoy-check { margin: 0; }
.tk-title { font-weight: 700; min-width: 0; overflow-wrap: anywhere; }
.tk-client { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-owner { min-width: 0; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; overflow: hidden; }
.tk-owner .hoy-owners { flex: none; }
.tk-date { white-space: nowrap; font-weight: 600; }
.tk-date.late { color: var(--danger); font-weight: 800; }
@media (max-width: 640px) {
  .tk-head { display: none; }
  .tk-row { grid-template-columns: 28px minmax(0, 1fr); row-gap: 3px; padding: 10px 12px; }
  .tk-row > * { grid-column: 2; }
  .tk-row > .hoy-check { grid-column: 1; grid-row: 1 / span 4; align-self: start; margin-top: 3px; }
  .tk-client, .tk-owner, .tk-date { font-size: 12.5px; color: var(--muted); }
  .tk-date.late { color: var(--danger); }
}
/* Hoy: columna Categoría y filtros de tareas */
.tk-head, .tk-row { grid-template-columns: 28px minmax(0, 2.2fr) minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1.3fr) minmax(0, 0.9fr); }
.tk-cat { display: inline-block; font-size: 11px; font-weight: 800; padding: 2px 9px; border-radius: 99px; white-space: nowrap; letter-spacing: .02em; }
.tk-cat.marketing { background: #e2ecfb; color: #2457a8; }
.tk-cat.audiovisual { background: #f1e4f6; color: #7a3b8f; }
.tk-cat.rowly { background: #ece8e1; color: #5d564c; }
.tk-filters { margin: 0 0 12px; padding: 0; }
.tk-filters input[type=search] { flex: 1 1 220px; }
@media (max-width: 640px) { .tk-filters select, .tk-filters .mk-range { flex: 1 1 45%; } }
/* Calendario: bloque "Hoy" con tareas, reuniones, entregables y rodajes */
.hoy-cal-sec { margin-bottom: 12px; }
.hoy-cal-h { font-size: 12.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); margin: 6px 0 6px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.hoy-cal-sec .gchip.wide { margin-bottom: 4px; }
.hoy-cal-sec .gchip.done { opacity: .5; text-decoration: line-through; }

/* ===== Vista de calendario (Marketing y Audiovisual) ===== */
.view-toggle button { padding: 6px 14px; border-radius: 99px; font: inherit; font-size: 13px; font-weight: 600; color: var(--muted); background: none; border: none; cursor: pointer; white-space: nowrap; }
.view-toggle button.on { background: var(--accent); color: #fff; }
.view-toggle button:not(.on):hover { color: var(--text); }
.mk-cal-box { padding: 16px 18px; }
.mk-cal-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.mk-cal-top .cal-nav { display: flex; align-items: center; gap: 8px; }
.mk-cal-top h4 { margin: 0 6px; min-width: 150px; text-align: center; }
.mk-kinds { display: flex; flex-wrap: wrap; gap: 6px; }
.mk-kind { font: inherit; font-size: 12.5px; font-weight: 600; padding: 5px 11px; border-radius: 99px; border: 1px solid var(--border); background: var(--panel); color: var(--muted); cursor: pointer; }
.mk-kind.on { background: var(--accent); color: #fff; border-color: var(--accent); }
.mk-cal-grid .gchip { font-size: 11px; }
@media (max-width: 700px) { .mk-cal-box { padding: 10px; } .mk-cal-grid .gchip-t { display: none; } }
.team-pick { border: 1px solid var(--border); border-radius: 10px; padding: 8px 12px 10px; display: flex; gap: 14px; flex-wrap: wrap; margin: 0; }
.team-pick legend { font-size: 12.5px; color: var(--muted); padding: 0 4px; }
.team-pick label { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; }
/* Lugar del rodaje: enlace de Google Maps para copiar o enviar */
.maps-share { border: 1px solid var(--border); background: var(--card, #f6f2ea); border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; }
.maps-share[hidden] { display: none; }
.maps-link { font-weight: 700; font-size: 13.5px; color: var(--text); word-break: break-word; }
.maps-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.maps-actions .btn { text-decoration: none; }
.maps-inline { color: var(--text); font-weight: 600; text-decoration: none; border-bottom: 1px dotted var(--muted); }

/* ===== Clientes: barra Tarjetas | Lista y arrastrar para ordenar ===== */
.cl-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 4px 0 10px; }
.cl-label { font-size: 12.5px; color: var(--muted); font-weight: 600; }
.mk-card { cursor: grab; }
.mk-card.dragging, .cl-list tr.dragging { opacity: .45; }
.cl-list { padding: 0; overflow: hidden; margin-bottom: 16px; }
.cl-list tr[draggable=true] { cursor: grab; }
.cl-list .icon-btn { font-size: 12px; padding: 2px 8px; }
.cl-list .icon-btn:disabled { opacity: .3; }

/* ===== Proyecto audiovisual: página con tarjetas ===== */
.av-top { align-items: center; gap: 12px; }
.av-back { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border); background: var(--panel); font-size: 20px; text-decoration: none; color: var(--text); flex: none; }
.av-back:hover { border-color: var(--accent); }
.av-status { display: inline-block; font-size: 11.5px; font-weight: 800; padding: 2px 9px; border-radius: 99px; background: #dff1e7; color: #1f6b47; }
.av-status.fin { background: #ece8e1; color: #5d564c; }
.av-proj { display: flex; flex-direction: column; gap: 16px; }
.av-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.av-two { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.av-wide { grid-column: 1 / -1; }
.av-card { padding: 16px 18px; min-width: 0; }
.av-card-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.av-card-h h3 { margin: 0; font-size: 16px; }
.av-text { margin: 0 0 10px; white-space: pre-wrap; line-height: 1.5; }
.av-dl { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; margin: 0; font-size: 14px; }
.av-dl dt { color: var(--muted); } .av-dl dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.av-deliv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.av-deliv { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; padding: 12px; display: flex; flex-direction: column; gap: 10px; border-left: 4px solid var(--border); }
.av-deliv.ok { border-left-color: #1f8a5b; }
.av-deliv.late { border-left-color: var(--danger); }
.av-deliv-top { display: flex; align-items: flex-start; gap: 10px; }
.av-deliv-top > div { flex: 1; min-width: 0; }
.av-deliv-ic { font-size: 22px; line-height: 1; }
.av-deliv-meta { display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; color: var(--muted); align-items: center; flex-wrap: wrap; }
.av-deliv-meta > span { display: inline-flex; align-items: center; gap: 6px; }
.av-link { text-align: center; text-decoration: none; }
.av-link-in { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--muted); }
.av-link-in input { font: inherit; font-size: 13px; padding: 7px 9px; border: 1px solid var(--border); border-radius: 8px; background: var(--card, #fff); color: var(--text); }
.av-inv { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.av-inv li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; }
.av-inv .grow { flex: 1; min-width: 120px; }
.av-inv select, .av-inv input { font: inherit; font-size: 12.5px; padding: 5px 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--card, #fff); color: var(--text); }
.av-rent { width: 110px; }
.av-split input[type=number] { width: 80px; font: inherit; padding: 4px 6px; border: 1px solid var(--border); border-radius: 8px; }
.av-finish { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; padding: 8px 0 24px; }
.btn.big { font-size: 15px; padding: 12px 20px; }
.av-probs { margin: 8px 0 14px; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
@media (max-width: 760px) {
  .av-grid, .av-two { grid-template-columns: 1fr; }
  .av-finish { align-items: stretch; }
  .av-finish .btn { width: 100%; }
}

/* ===== Agregar proyecto audiovisual: formulario con dictado ===== */
.intake-modal { width: min(720px, 100%); max-height: 92vh; overflow-y: auto; }
.intake { display: grid; gap: 14px; }
.intake .modal-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.in-card { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; background: var(--surface, #fff); }
.in-card h4 { margin: 0 0 10px; font-size: 14px; }
.in-card .span { grid-column: 1 / -1; }
.in-voice-top { display: flex; gap: 14px; align-items: center; }
.in-voice-txt { display: grid; gap: 2px; }
.in-voice .vq-mic { width: 64px; height: 64px; }
.in-live { margin: 0; }
.in-text { width: 100%; font: inherit; padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; resize: vertical; box-sizing: border-box; }
.in-row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.in-team { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.in-item { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-bottom: 6px; }
.in-item > input:first-child { flex: 1 1 180px; min-width: 0; }
.in-fixed td { color: var(--muted, #888); }
.in-map { margin: 0; }
/* Dictado fijo arriba: al desplazarte, el micrófono y las preguntas siguen a la vista */
.in-voice { position: relative; border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; background: var(--surface, #fff); box-shadow: 0 6px 14px rgba(0, 0, 0, .10); display: grid; gap: 8px; }
.in-qs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 6px; }
.in-qs li { display: grid; gap: 2px; min-width: 0; padding: 6px 8px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg, #f6f4f0); font-size: 12px; line-height: 1.25; }
.in-qs li.ok { background: rgba(31, 138, 91, .10); border-color: rgba(31, 138, 91, .45); }
.in-q { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.in-q i { font-style: normal; font-weight: 400; color: var(--muted, #888); }
.in-ck { color: var(--muted, #888); }
.in-qs li.ok .in-ck { color: #1f8a5b; }
.in-a { font-weight: 600; font-size: 12px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
.in-pend { color: var(--muted, #888); font-weight: 400; font-style: italic; }
.in-voice .in-text { min-height: 0; }
@media (max-width: 560px) {
  .in-voice-top .muted { display: none; }
  .in-voice .vq-mic { width: 52px; height: 52px; }
  .in-qs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ===== Involucrados en fila, botón de responsables y demostración de envío ===== */
.av-team-row { display: flex; flex-wrap: nowrap; gap: 6px; align-items: center; margin-bottom: 4px; }
.av-team-one { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.av-team-one .hoy-av { flex: none; }
.av-send { margin-top: 12px; }
.send-modal { width: min(640px, 100%); max-height: 92vh; overflow-y: auto; }
.send-demo { display: grid; gap: 12px; }
.send-demo .modal-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.send-card { border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; display: grid; gap: 8px; }
.send-to { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.send-msg { margin: 0; white-space: pre-wrap; font: inherit; font-size: 13px; line-height: 1.45; background: var(--bg, #f6f4f0); border-radius: 8px; padding: 10px 12px; }

/* Selector "Agregar involucrado": con aire arriba y tamaño normal */
.av-add-team { margin: 14px 0 10px; }
.av-add-team label { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.av-add-team select { width: auto; min-width: 170px; max-width: 100%; padding: 6px 10px; font: inherit; font-size: 13px; border: 1px solid var(--border); border-radius: 8px; }

/* Icono de lente (cámara), no de telescopio */
.lens-ico { width: 1.15em; height: 1.15em; fill: none; stroke: currentColor; stroke-width: 2; vertical-align: -0.2em; display: inline-block; }

/* ===== Inventario en cajitas (hasta 5 por fila) y entregables más pequeños ===== */
.av-inv-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.av-inv-box { position: relative; border: 1px solid var(--border); border-radius: 10px; padding: 8px 8px 8px; display: grid; gap: 4px; background: var(--panel); min-width: 0; font-size: 12px; align-content: start; }
.av-inv-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 18px; font-size: 12.5px; }
.av-inv-x { position: absolute; top: 2px; right: 2px; width: 22px; height: 22px; font-size: 11px; }
.av-inv-box select, .av-inv-box .av-rent { width: 100%; font: inherit; font-size: 11.5px; padding: 3px 5px; border: 1px solid var(--border); border-radius: 6px; background: var(--card, #fff); color: var(--text); min-width: 0; }
.av-inv-box .av-rent { width: 100%; }
@media (max-width: 1000px) { .av-inv-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 760px) { .av-inv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 500px) { .av-inv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Entregables: cerca de la mitad del tamaño anterior (ancho y alto) */
.av-deliv-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important; gap: 8px !important; }
.av-deliv { padding: 7px 8px !important; gap: 6px !important; border-radius: 10px !important; }
.av-deliv-top { gap: 6px !important; }
.av-deliv-ic { font-size: 15px !important; }
.av-deliv-top b { font-size: 12.5px; }
.av-deliv-meta { font-size: 11px !important; }
.av-link { padding: 3px 7px !important; font-size: 11.5px !important; }
.av-link-in { font-size: 10.5px !important; gap: 2px !important; }
.av-link-in input { font-size: 11px !important; padding: 4px 6px !important; }
.av-link-small { font: inherit; font-size: 11.5px; padding: 4px 6px; border: 1px solid var(--border); border-radius: 6px; width: 100%; box-sizing: border-box; min-width: 0; }
.av-deliv-table td, .av-deliv-table th { font-size: 12.5px; }
.av-deliv-table .av-link-small { width: 120px; }

/* ===== Inventario y reparto lado a lado: cajitas de 4 por fila; propio (azul) y rentado (ámbar) ===== */
.av-inv-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.av-inv-box.propio { background: #e8f0fc; border-color: #9bb8e6; }
.av-inv-box.rentado { background: #fff0cf; border-color: #e0a93b; cursor: pointer; }
.av-inv-box.rentado:hover { box-shadow: 0 0 0 2px rgba(224, 169, 59, .35); }
@media (max-width: 760px) { .av-inv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 500px) { .av-inv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
.av-lg { display: inline-block; width: 12px; height: 12px; border-radius: 3px; border: 1px solid; vertical-align: -2px; margin: 0 4px 0 8px; }
.av-lg.propio { background: #e8f0fc; border-color: #9bb8e6; }
.av-lg.rentado { background: #fff0cf; border-color: #e0a93b; }
.av-legend { margin: 0 0 8px; }
.av-inv-btns { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.av-dest-rent td { color: #8a5a00; }
.av-dest-fixed td { color: var(--muted, #777); }

/* ===== Página del proyecto: secciones desplegables, entregables con barra y nuevo orden ===== */
.av-grid > .av-two { grid-column: 1 / -1; }
.av-toggle { border: 0; background: transparent; color: var(--muted, #777); font-size: 15px; line-height: 1; padding: 2px 6px 2px 0; cursor: pointer; }
.av-toggle:hover { color: var(--text, #222); }
.av-card-h h3 { display: flex; align-items: center; gap: 2px; margin: 0; }
/* Entregables: se ven 4 y el resto se desplaza con la barra al lado */
.av-scroll-4 { max-height: 178px; overflow-y: auto; padding-right: 6px; scrollbar-gutter: stable; }
.av-scroll-4.is-list { max-height: 252px; }
.av-scroll-4 .av-deliv-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
@media (max-width: 1000px) { .av-scroll-4 .av-deliv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 760px) { .av-scroll-4 .av-deliv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } .av-scroll-4 { max-height: 240px; } }

/* ===== Arriba: contacto + detalle a la izquierda, reparto del dinero a la derecha ===== */
.av-top3 { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.av-stack { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
@media (max-width: 760px) { .av-top3 { grid-template-columns: 1fr; } }
.av-dl .av-text { margin: 0; font-weight: 500; }

/* Entregables compactos: título arriba a la izquierda, botones arriba a la derecha */
.av-card-h { flex-wrap: nowrap; }
.av-card-h > span { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.av-scroll-4 { max-height: 112px; }
.av-scroll-4.is-list { max-height: 190px; }
.av-scroll-4 .av-deliv { padding: 6px 8px !important; gap: 4px !important; border-left-width: 3px; }
.av-scroll-4 .av-deliv-top .muted { display: none; }
.av-scroll-4 .av-deliv-top b { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.av-scroll-4 .av-deliv-top .icon-btn { width: 22px; height: 22px; padding: 0; font-size: 12px; }
.av-scroll-4 .av-link { padding: 2px 6px !important; }
@media (max-width: 760px) { .av-scroll-4 { max-height: 230px; } .av-card-h { flex-wrap: wrap; } }

/* Mantener oprimido para finalizar */
.hold-btn { position: relative; overflow: hidden; width: 100%; padding: 14px; border: 1px solid var(--danger, #c0392b); border-radius: 12px; background: var(--panel); color: var(--text); font: inherit; font-weight: 700; cursor: pointer; user-select: none; touch-action: none; margin: 8px 0 4px; }
.hold-btn .hold-fill { position: absolute; inset: 0 auto 0 0; width: 0; background: rgba(192, 57, 43, .3); pointer-events: none; }
.hold-btn .hold-txt { position: relative; pointer-events: none; }
.av-scroll-4 .av-link-in { font-size: 0 !important; }
.av-scroll-4 .av-link-in input { font-size: 11px !important; }
.av-scroll-4 { max-height: 100px; }
.av-card-h h3 { white-space: nowrap; }

/* ===== Entregables: tarjetas pequeñas, 6 por fila (la barra lateral sigue mostrando el resto) ===== */
.av-scroll-4 { max-height: 118px !important; }
.av-scroll-4.is-list { max-height: 190px !important; }
.av-scroll-4 .av-deliv-grid { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 6px !important; }
.av-scroll-4 .av-deliv { padding: 5px 6px !important; min-width: 0; }
.av-scroll-4 .av-deliv-top b { font-size: 11.5px; }
.av-scroll-4 .av-deliv-meta { font-size: 10.5px !important; flex-direction: column; align-items: flex-start; gap: 2px; }
.av-scroll-4 .av-deliv-meta .hoy-av { width: 16px; height: 16px; font-size: 9px; }
.av-scroll-4 .av-link-in input { width: 100%; box-sizing: border-box; min-width: 0; }
@media (max-width: 1000px) { .av-scroll-4 .av-deliv-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } }
@media (max-width: 600px) { .av-scroll-4 .av-deliv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } .av-scroll-4 { max-height: 180px !important; } }

/* ===== Grupos de equipos en Inventario ===== */
.inv-groups { margin-bottom: 14px; }
.inv-groups > h3 { margin: 0 0 4px; }
.grp-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; margin-top: 10px; }
.grp-card { border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; background: var(--panel); display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.grp-card.full { background: #f3f0ea; }
.grp-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.grp-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.grp-chip { font-size: 11.5px; background: #e8f0fc; border: 1px solid #9bb8e6; border-radius: 6px; padding: 2px 6px; }
.grp-chip.more { background: transparent; border-style: dashed; }
.grp-actions { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.grp-new { border: 1px dashed var(--border); border-radius: 12px; background: transparent; color: var(--muted); min-height: 80px; cursor: pointer; font: inherit; }
.grp-new:hover { border-color: var(--accent); color: var(--text); }
.grp-pick-list { max-height: 46vh; overflow-y: auto; border: 1px solid var(--border); border-radius: 10px; padding: 6px 10px; margin: 8px 0; }
.grp-newgear { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.grp-newgear input { flex: 1 1 180px; font: inherit; padding: 6px 8px; border: 1px solid var(--border); border-radius: 8px; }
.grp-newgear select { font: inherit; padding: 6px 8px; border: 1px solid var(--border); border-radius: 8px; }
.av-scroll-4 { max-height: 190px !important; }
.av-scroll-4.is-list { max-height: 190px !important; }

/* ===== Grupos de equipos: márgenes cómodas y plegable ===== */
.inv-groups { padding: 16px 20px 18px !important; margin: 0 0 16px !important; }
.inv-grp-h h3 { display: flex; align-items: center; gap: 4px; margin: 0; }
.inv-grp-body { margin-top: 8px; }
.inv-grp-body[hidden] { display: none; }
.inv-groups .grp-cards { margin-top: 12px; }

/* ===== Entregables: cuadros compactos de tamaño fijo (no se estiran con la pantalla) ===== */
.av-scroll-4 .av-deliv-grid { grid-template-columns: repeat(auto-fill, 140px) !important; justify-content: start; gap: 8px !important; }
.av-scroll-4 .av-deliv { width: 140px; box-sizing: border-box; padding: 6px 7px !important; }
.av-scroll-4 .av-deliv-meta > span:last-child { font-size: 10.5px; }
.av-scroll-4 .av-deliv-meta .late-pill { font-size: 10.5px; }
@media (max-width: 1000px) { .av-scroll-4 .av-deliv-grid { grid-template-columns: repeat(auto-fill, 140px) !important; } }
@media (max-width: 600px) { .av-scroll-4 .av-deliv-grid { grid-template-columns: repeat(auto-fill, 130px) !important; } }

/* ===== Entregables: colores por estado (pendiente amarillo, entregado verde, vencido rojo) ===== */
.av-deliv { background: #fff4c2; border-color: #e3c24e; border-left-color: #e3c24e; }
.av-deliv.ok { background: #d8f3e3; border-color: #5fb88a; border-left-color: #1f8a5b; }
.av-deliv.late { background: #fbdada; border-color: #d9656f; border-left-color: #c23a47; }
.av-deliv .late-pill { color: #9b1c2a; font-weight: 700; }

/* Tarjetas pequeñas con textos fijos: nada se descuadra al achicar */
.av-scroll-4 .av-deliv { min-height: 96px; justify-content: space-between; box-sizing: border-box; overflow: hidden; }
.av-scroll-4 .av-deliv-top { min-width: 0; }
.av-scroll-4 .av-deliv-top > div { min-width: 0; overflow: hidden; }
.av-scroll-4 .av-deliv-top b { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; }
.av-scroll-4 .av-deliv-top .icon-btn { flex: none; }
.av-scroll-4 .av-deliv-meta { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 0; }
.av-scroll-4 .av-deliv-meta > span { display: flex; align-items: center; gap: 4px; min-width: 0; max-width: 100%; font-size: 10.5px; }
.av-who { font-style: normal; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.av-scroll-4 .av-link-in { min-width: 0; width: 100%; }
.av-scroll-4 .av-link-in input { width: 100%; box-sizing: border-box; min-width: 0; font-size: 10.5px !important; padding: 3px 5px !important; }

/* Inventario: el nombre puede ocupar dos líneas y la X no lo tapa */
.av-inv-box { padding: 22px 6px 6px !important; min-width: 0; position: relative; }
.av-inv-x { top: 3px !important; right: 3px !important; }
.av-inv-name { white-space: normal !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding-right: 0 !important; overflow-wrap: anywhere; line-height: 1.2; font-size: 12px; }
.av-inv-box .muted { overflow-wrap: anywhere; }

/* Pagos del cliente: tabla que se ajusta al ancho de la tarjeta */
.av-pay-tbl { table-layout: fixed; width: 100%; }
.av-pay-tbl th, .av-pay-tbl td { font-size: 12px; padding: 6px 4px; overflow-wrap: anywhere; }
.av-pay-tbl th:first-child, .av-pay-tbl td:first-child { width: 28px; }
.av-pay-tbl th:last-child, .av-pay-tbl td:last-child { width: 30px; }
.av-paysum { margin: -4px 0 8px; }

/* Descripción por voz */
.av-mic.on { background: #c23a47; color: #fff; border-color: #c23a47; }

/* ===== Ventanas de detalle y edición ===== */
.av-field { display: flex; flex-direction: column; gap: 4px; }
.av-field textarea { font: inherit; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--card, #fff); color: var(--text); resize: vertical; }
.av-label-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13px; color: var(--muted); }
.mk-click { cursor: pointer; }
.mk-click:hover { background: rgba(0, 0, 0, .03); }
.sh-gear { display: flex; flex-direction: column; gap: 6px; margin: 8px 0; }
.sh-gear-list { display: flex; flex-wrap: wrap; gap: 4px; }
.sh-gear-x { border: 0; background: transparent; cursor: pointer; color: var(--muted); padding: 0 0 0 4px; }
.send-demo h4 { margin: 12px 0 4px; }

/* ===== Elegir equipos: botones de grupo; destino al finalizar; formulario de entregables ===== */
.grp-quick { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; }
.grp-q { border: 1px solid var(--border); background: var(--panel); border-radius: 99px; padding: 5px 11px; font: inherit; font-size: 13px; cursor: pointer; }
.grp-q:hover { border-color: var(--accent); }
.dest-choices { display: flex; flex-direction: column; gap: 8px; margin: 12px 0; }
.dest-choices .btn { width: 100%; justify-content: center; }

/* ===== Audiovisual: tarjetas de proyecto sin foto ===== */
.av-pcard { width: 280px; flex: 0 0 auto; background: var(--panel); border: 1px solid var(--border); border-radius: 16px; padding: 14px 16px !important; overflow: hidden; display: flex; flex-direction: column; gap: 5px; cursor: pointer; text-align: left; transition: transform .15s ease, box-shadow .15s ease; }
.av-pcard:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0, 0, 0, .10); }
.avc-name { margin: 0; font-size: 17px; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avc-co { color: var(--muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avc-svc { font-size: 12.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.av-pcard .mk-flag { align-self: flex-start; }
.avc-dl { display: flex; flex-direction: column; gap: 5px; margin-top: 4px; }
.avc-chip { border: 0; text-align: left; font: inherit; font-size: 12.5px; font-weight: 600; padding: 6px 10px; border-radius: 8px; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avc-chip:hover { filter: brightness(.96); }
.avc-chip.pend { background: #fff4c2; color: #6b5300; }
.avc-chip.ok { background: #d8f3e3; color: #14603d; }
.avc-chip.late { background: #fbdada; color: #9b1c2a; }
.avc-more { align-self: flex-start; border: 0; background: transparent; color: var(--accent, #2f6fd6); font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; padding: 2px 0; }

/* Lista de entregables del proyecto (ventana "Ver más") */
.dl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); gap: 8px; margin: 10px 0; max-height: 60vh; overflow-y: auto; }
.dl-box { border-radius: 12px; padding: 8px 9px; border: 1px solid; text-align: left; font: inherit; cursor: pointer; display: flex; flex-direction: column; gap: 3px; min-width: 0; transition: transform .15s ease, box-shadow .15s ease; }
.dl-box:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0, 0, 0, .10); }
.dl-box b { font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dl-box.pend { background: #fff4c2; border-color: #e3c24e; }
.dl-box.ok { background: #d8f3e3; border-color: #5fb88a; }
.dl-box.late { background: #fbdada; border-color: #d9656f; }
.dl-ic { font-size: 16px; line-height: 1; }
.dl-sub { font-size: 11px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dl-st { font-size: 11px; font-weight: 700; }

/* Lista de proyectos: tres líneas para arrastrar */
.cl-grab { cursor: grab; font-size: 16px; color: var(--muted); user-select: none; padding: 0 4px; line-height: 1; }
.cl-grab:active { cursor: grabbing; }
.cl-grab-cell { width: 34px; }

/* Entregables: hover con movimiento sutil y manito, en tarjetas y en lista */
.av-deliv { cursor: pointer; transition: transform .15s ease, box-shadow .15s ease; }
.av-deliv:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0, 0, 0, .12); }
.av-deliv-table tbody tr[data-deliv] { cursor: pointer; transition: background .15s ease; }
.av-deliv-table tbody tr[data-deliv]:hover { background: rgba(0, 0, 0, .05); }

/* Cuadros de entregables: el número por fila lo calcula la página según el ancho */
.av-scroll-4 .av-deliv-grid.av-fit { grid-template-columns: repeat(var(--cols, 6), var(--cw, 140px)) !important; justify-content: start; gap: 8px !important; }

/* Pagos del cliente: el texto se achica con el ancho de la tarjeta, sin cortar palabras */
.av-pay-card { container-type: inline-size; }
.av-pay-tbl { table-layout: auto; width: 100%; }
.av-pay-tbl th, .av-pay-tbl td { font-size: clamp(9px, 3.3cqi, 12.5px) !important; padding: 5px 3px !important; }
.av-pay-tbl th { white-space: nowrap; }
.av-pay-tbl td:nth-child(3), .av-pay-tbl td:nth-child(4), .av-pay-tbl td:nth-child(5) { white-space: nowrap; }
.av-pay-tbl td:nth-child(2) { overflow-wrap: anywhere; }
.av-pay-tbl .mk-bill-st { font-size: clamp(8px, 2.9cqi, 11px); padding: 2px 5px; white-space: nowrap; }
.av-pay-tbl th:first-child, .av-pay-tbl td:first-child, .av-pay-tbl th:last-child, .av-pay-tbl td:last-child { width: 26px; }

/* Reuniones: la tarjeta de solo lectura */
.meet-card .av-text { white-space: pre-wrap; }
.meet-card fieldset { margin: 8px 0; }
.av-pcard .mk-flag { position: static; display: inline-block; margin: 0; }
.av-scroll-4 .av-deliv-grid.av-fit .av-deliv { width: auto; min-width: 0; }
.av-pay-tbl .av-pay-main b { display: block; overflow-wrap: anywhere; }
.av-pay-tbl .av-pay-main .mk-bill-st { display: inline-block; margin-top: 3px; }

/* ===== Tarjetas de proyecto: color del cliente, entregables cuadrados con fecha ===== */
.av-pcard { background: color-mix(in srgb, var(--cc, #2f6fd6) 16%, #fff) !important; border: 1px solid color-mix(in srgb, var(--cc, #2f6fd6) 45%, #fff) !important; border-left: 6px solid var(--cc, #2f6fd6) !important; box-shadow: 0 2px 8px rgba(0, 0, 0, .06); }
.av-pcard .avc-name { color: #1b1a17; font-size: 18px; }
.avc-meta { display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; color: #3d3830; }
.avc-meta b { color: #1b1a17; }
.avc-ent-h { margin-top: 8px; font-size: 12.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: color-mix(in srgb, var(--cc, #2f6fd6) 75%, #000); }
.avc-sqs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.avc-sq { aspect-ratio: 1 / 1; border: 0; border-radius: 12px; padding: 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font: inherit; text-align: center; cursor: pointer; min-width: 0; overflow: hidden; transition: transform .15s ease, box-shadow .15s ease; }
.avc-sq:hover { transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0, 0, 0, .15); }
.avc-sq b { font-size: 13px; line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.avc-sq span { font-size: 12px; font-weight: 600; }
.avc-sq.pend { background: #ffd84d; color: #4d3b00; }
.avc-sq.ok { background: #2fbf71; color: #fff; }
.avc-sq.late { background: #ff5a5f; color: #fff; }
/* Que el movimiento al pasar el mouse no se corte arriba */
.av-scroll-4 { padding-top: 8px !important; padding-left: 4px !important; }

/* Nueva tarea: elegir Audiovisual o Marketing */
.seg-area { display: flex; gap: 8px; }
.seg-area label { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--border); border-radius: 10px; padding: 9px; cursor: pointer; font-weight: 600; }
.seg-area label:has(input:checked) { border-color: var(--accent, #2f6fd6); background: rgba(47, 111, 214, .08); }
.seg-area input { accent-color: var(--accent, #2f6fd6); }
.av-steps { list-style: none; padding: 0; margin: 0 0 10px; display: flex; flex-direction: column; gap: 4px; }

/* ===== Tarjeta de proyecto con degradado del color del cliente (sin letra) ===== */
.av-pcard.av-grad { padding: 0 !important; border: 0 !important; border-radius: 18px !important; background: #f6f1e8 !important; box-shadow: 0 6px 18px rgba(0, 0, 0, .12); width: 290px; }
.avg-hero { position: relative; min-height: 118px; padding: 14px 14px 12px; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden;
  background: radial-gradient(circle at 22% 18%, rgba(255, 255, 255, .28), transparent 42%), radial-gradient(circle at 88% 82%, rgba(0, 0, 0, .18), transparent 46%), linear-gradient(160deg, color-mix(in srgb, var(--cc) 85%, #fff) 0%, var(--cc) 55%, color-mix(in srgb, var(--cc) 62%, #000) 100%); }
.avg-owner { position: absolute; top: 10px; right: 10px; display: inline-flex; align-items: center; gap: 6px; background: rgba(255, 255, 255, .95); color: #1b1a17; border-radius: 99px; padding: 3px 9px 3px 3px; font-size: 12px; font-weight: 700; box-shadow: 0 2px 6px rgba(0, 0, 0, .2); }
.avg-owner .hoy-av { width: 20px; height: 20px; font-size: 10px; margin: 0; border: 0; }
.avg-flag { position: absolute; top: 12px; left: 12px; background: #c23a47; color: #fff; font-size: 11px; font-weight: 800; border-radius: 99px; padding: 2px 8px; }
.avg-name { margin: 0; font-size: 20px; line-height: 1.15; font-weight: 800; color: #fff; text-shadow: 0 1px 4px rgba(0, 0, 0, .25); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avg-body { padding: 12px 14px 10px; display: flex; flex-direction: column; gap: 6px; }
.avg-body .avc-co { color: #5d564c; font-size: 13px; }
.avg-body .avc-meta { color: #3d3830; }
.avg-foot { padding: 9px 14px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #5d564c; background: #ebe4d6; border-top: 1px solid #e0d7c6; }
/* Entregables: mismo diseño que en la página del proyecto, con la fecha de entrega en lugar del link */
.avc-sqs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.avc-d { display: flex; flex-direction: column; gap: 4px; text-align: left; font: inherit; cursor: pointer; min-width: 0; padding: 7px 8px; border-radius: 10px; border: 1px solid #e3c24e; border-left: 4px solid #e3c24e; background: #fff4c2; transition: transform .15s ease, box-shadow .15s ease; }
.avc-d.ok { background: #d8f3e3; border-color: #5fb88a; border-left-color: #1f8a5b; }
.avc-d.late { background: #fbdada; border-color: #d9656f; border-left-color: #c23a47; }
.avc-d:hover { transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0, 0, 0, .12); }
.avc-d-top { display: flex; align-items: center; gap: 5px; min-width: 0; }
.avc-d-top b { font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.avc-d-own { display: flex; align-items: center; gap: 4px; font-size: 11px; color: #5d564c; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avc-d-own .hoy-av { width: 16px; height: 16px; font-size: 9px; margin: 0; border: 0; flex: none; }
.avc-d-date { display: inline-block; align-self: flex-start; font-size: 11px; font-weight: 700; background: rgba(255, 255, 255, .7); border-radius: 6px; padding: 2px 6px; color: #3d3830; }
.avc-d-date.late-pill { background: #c23a47; color: #fff; }

/* ===== Hoy: entregables por área (violeta Audiovisual, café claro Marketing) ===== */
.hoy-av-d { background: #ece3ff !important; border-color: #a68be6 !important; border-left-color: #6b43c9 !important; }
.hoy-mk-d { background: #efe2cf !important; border-color: #c9a77a !important; border-left-color: #8a5a2b !important; }
.hoy-dgroup { margin-bottom: 10px; }
.hoy-dgroup-h { display: flex; align-items: center; gap: 6px; margin: 6px 0; font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #5d564c; }
.hoy-dgroup-h span { color: #8a8175; font-weight: 700; }
.hoy-dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; }
.hoy-dot.av, .hoy-legend i.av { background: #6b43c9; }
.hoy-dot.mk, .hoy-legend i.mk { background: #8a5a2b; }
.hoy-legend i.av, .hoy-legend i.mk { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin: 0 4px 0 10px; }
.hoy-deliv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.hoy-av-d .avc-d-top, .hoy-mk-d .avc-d-top { align-items: center; }

/* Inventario del dictado: espacio entre la barra de botones y la lista */
.in-row { margin-bottom: 12px; }
.in-row + [data-inv] { margin-top: 6px; }
.in-row .av-push { margin-left: auto; }
.av-review { vertical-align: middle; margin-left: 8px; font-size: 12px; }
.in-qs li { cursor: pointer; }
.in-qs li:hover { border-color: var(--accent, #2f6fd6); }

/* ===== Ciudad y equipo del rodaje: los nombres no se encimen ===== */
.sh-who { display: inline-flex; align-items: center; gap: 6px; margin-right: 14px; white-space: nowrap; }
.sh-who .hoy-av { margin: 0; }

/* ===== Hoy: grupos de entregables desplegables y tarjetas como las de la página del proyecto ===== */
.hoy-dgroup-h { display: flex; align-items: center; gap: 6px; width: 100%; background: none; border: 0; padding: 4px 0; margin: 6px 0; cursor: pointer; font: inherit; font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #5d564c; text-align: left; }
.hoy-dgroup-h:hover { color: #111; }
.hoy-caret { display: inline-block; width: 12px; transition: transform .15s ease; }
.hoy-dgroup-h[aria-expanded="false"] .hoy-caret { transform: rotate(-90deg); }
.hoy-deliv-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 8px !important; grid-auto-rows: auto !important; }
@media (max-width: 620px) { .hoy-deliv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 400px) { .hoy-deliv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }

.hdc { position: relative; display: flex; flex-direction: column; gap: 5px; min-width: 0; padding: 8px; border-radius: 12px; border: 1px solid #c9a77a; border-left: 4px solid #8a5a2b; background: #efe2cf; color: #1b1a17; text-align: left; font: inherit; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease; }
.hdc.av { background: #ece3ff; border-color: #a68be6; border-left-color: #6b43c9; }
.hdc:hover, .hdc:focus-visible { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0, 0, 0, .12); outline: none; }
.hdc.late { box-shadow: inset 0 0 0 1px #c23a47; }
.hdc-top { display: flex; align-items: flex-start; gap: 5px; min-width: 0; }
.hdc-top .av-deliv-ic { font-size: 15px; line-height: 1.2; flex: none; }
.hdc-top .hoy-check { margin-top: 2px; flex: none; }
.hdc-t { display: block; min-width: 0; font-size: 12.5px; line-height: 1.25; overflow-wrap: anywhere; white-space: normal; }
.hdc-ed { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 6px; background: rgba(255, 255, 255, .6); cursor: pointer; font-size: 12px; line-height: 22px; }
.hdc-ed:hover { background: #fff; }
.hdc-own { display: flex; align-items: center; gap: 4px; min-width: 0; font-size: 11px; color: #5d564c; }
.hdc-own > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.hdc-own .hoy-av { width: 16px; height: 16px; font-size: 9px; margin: 0; border: 0; flex: none; }
.hdc-sub { font-size: 10.5px; color: #7a7165; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hdc-date { align-self: flex-start; font-size: 11px; font-weight: 700; background: rgba(255, 255, 255, .7); border-radius: 6px; padding: 2px 6px; color: #3d3830; }
.hdc-date.late-pill { background: #c23a47; color: #fff; }
.hdc-link-a { font-size: 11px; font-weight: 700; color: #2f6fd6; text-decoration: none; }
.hdc-link-in { width: 100%; box-sizing: border-box; min-width: 0; font: inherit; font-size: 11px; padding: 4px 6px; border: 1px solid #c9b8a0; border-radius: 6px; background: #fff; color: #1b1a17; }

/* Entregables de la página del proyecto: el título se acomoda en varias líneas (sin "...") */
.av-scroll-4 .av-deliv-top b { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; overflow-wrap: anywhere; }

/* ===== Hoy: filtros de entregables, tipo de servicio "Otro", reuniones y correo ===== */
.dv-filters { margin: 4px 0 8px; }
.dv-filters select, .dv-filters input[type="date"] { font: inherit; font-size: 12.5px; padding: 4px 6px; }
.av-other { margin-top: 8px; display: grid; gap: 6px; }
.av-remember { display: flex; align-items: center; gap: 6px; font-size: 13px; }
.mail-preview { white-space: pre-wrap; background: var(--panel, #fff); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; font: inherit; font-size: 13px; max-height: 260px; overflow: auto; margin: 8px 0; }
.meet-make { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.cl-meets { margin-top: 14px; }
.cl-meets .av-card-h { margin-bottom: 6px; }
.cl-meet-tbl td, .cl-meet-tbl th { font-size: 12.5px; }
.cl-meet-tbl tr[data-meet] { cursor: pointer; }
.cl-meet-tbl tr.done td { color: var(--muted); }
.dv-state { display: flex; align-items: flex-end; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.dv-state label { flex: 1; min-width: 200px; }

/* Lo que va oculto con el atributo hidden, sigue oculto aunque tenga otro estilo de pantalla */
[hidden] { display: none !important; }

/* Hoy: tarjetas de entregables con el mismo tamaño que la amarilla de la página del proyecto (.av-deliv: 114 px de alto, relleno 6px 7px, título 12px) */
.hoy-deliv-grid { grid-auto-rows: 114px !important; }
.hoy-deliv-grid .hdc { padding: 6px 7px; gap: 4px; border-radius: 10px; width: 100%; box-sizing: border-box; }
.hoy-deliv-grid .hdc-t { font-size: 12px; }

/* ===== Calendario en celular: todo cabe en la pantalla, los días son cuadros completos ===== */
@media (max-width: 600px) {
  .calendario-page .topbar, #root .topbar:has(.cal-nav) { flex-wrap: wrap; gap: 10px; }
  .cal-nav { flex-wrap: wrap; width: 100%; justify-content: space-between; gap: 8px; }
  .cal-nav .view-toggle { order: -1; width: 100%; display: flex; margin-right: 0; }
  .cal-nav .view-toggle a { flex: 1; text-align: center; }
  .cal-nav h4 { flex: 1; min-width: 0; font-size: 15px; margin: 0; text-align: center; }
  .cal-nav .icon-btn { padding: 0 8px; }
  .cal-nav .btn.sm { padding: 4px 8px; font-size: 12px; }
  .gcal-layout { gap: 10px; }
  .gcal-grid { border-radius: 8px; }
  .cal-dow { padding: 5px 0; font-size: 9.5px; text-align: center; letter-spacing: 0; }
  .gcal-cell { min-height: 0; aspect-ratio: 1 / 1.15; padding: 3px 2px; overflow: hidden; }
  .gcal-cell .cal-num { width: 20px; height: 20px; font-size: 11px; margin: 0 auto; }
  .gcal-cell .gchip { height: 5px; margin-bottom: 2px; border-radius: 3px; }
  .gcal-cell .gchip span { display: none; }
  .gcal-cell .cal-more, .gcal-cell .muted { font-size: 9px; text-align: center; line-height: 1.1; }
  .gcal-side { padding: 12px; }
  .page-main { padding-left: 12px; padding-right: 12px; }
}

/* ===== Encabezado del proyecto: panel del color del cliente, nombre grande en blanco ===== */
.topbar.avh { position: relative; top: auto; margin: 12px 14px 0; padding: 16px 18px; border-radius: 16px; border: 0; color: #fff; display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  background: radial-gradient(circle at 22% 18%, rgba(255, 255, 255, .28), transparent 42%), radial-gradient(circle at 88% 82%, rgba(0, 0, 0, .18), transparent 46%), linear-gradient(160deg, color-mix(in srgb, var(--cc) 85%, #fff) 0%, var(--cc) 55%, color-mix(in srgb, var(--cc) 62%, #000) 100%);
  box-shadow: 0 6px 16px rgba(0, 0, 0, .12); }
.avh .av-back { flex: none; background: rgba(255, 255, 255, .22); border-color: rgba(255, 255, 255, .55); color: #fff; }
.avh .avh-brand { flex: 1 1 200px; min-width: 0; }
.avh .avh-name { margin: 0; color: #fff; font-size: 30px; font-weight: 800; line-height: 1.1; text-shadow: 0 1px 4px rgba(0, 0, 0, .25); }
.avh .avh-sub { margin: 6px 0 0; color: rgba(255, 255, 255, .92); font-size: 14px; }
.avh .av-status { background: #fff; color: #1b1a17; }
.avh .av-review { flex: none; background: #fff; color: #1b1a17; border-color: #fff; font-weight: 700; }
@media (max-width: 560px) {
  .avh .avh-name { font-size: 24px; }
  .avh .av-review { margin-left: auto; }
}

/* Hoy: todas las tarjetas de una fila quedan del mismo alto */
.hoy-deliv-grid { align-items: stretch !important; }

/* Entregables del proyecto: tarjetas chicas, del mismo tamaño, título en una sola línea que se desplaza al pasar el cursor */
.av-scroll-4 .av-deliv-grid .av-deliv, .av-deliv-grid .av-deliv { height: 108px; box-sizing: border-box; overflow: hidden; }
.av-deliv .av-deliv-top > div { min-width: 0; overflow: hidden; }
.av-deliv .av-deliv-top b { display: block; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; overflow-wrap: normal !important; font-size: 12px !important; line-height: 1.25; }
.av-deliv .av-deliv-top b.mq { width: max-content; max-width: none; overflow: visible !important; text-overflow: clip !important; animation: avDelivMq 2.6s ease-in-out infinite alternate; }
@keyframes avDelivMq { from { transform: translateX(0); } to { transform: translateX(var(--mq, 0px)); } }
.av-deliv .av-deliv-top .muted { font-size: 10.5px !important; }
.av-deliv .av-deliv-meta { font-size: 10.5px !important; }
.av-deliv .av-deliv-meta .hoy-av { width: 16px !important; height: 16px !important; font-size: 9px !important; }
.av-deliv .av-link-in { font-size: 0 !important; }
.av-deliv .av-link-in input { font-size: 10.5px !important; }
@media (prefers-reduced-motion: reduce) { .av-deliv .av-deliv-top b.mq { animation: none; } }

/* Reuniones: campos con botón de dictado, cliente fijo y orden del día */
.vf { display: grid; gap: 6px; }
.vf-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.vf-head .sub-label { margin: 0; }
.vf input, .vf textarea { width: 100%; box-sizing: border-box; }
.meet-client { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--panel, #fff); }
.meet-client span { font-size: 12.5px; color: var(--muted); }
.meet-client b { font-size: 16px; font-weight: 800; }
/* Cliente del detalle de un entregable: más grande y en negrita */
.deliv-client { font-size: 17px; font-weight: 800; margin: 0 0 8px; color: var(--text, #1b1a17); }

/* Hoy: secciones que se retraen y despliegan */
.hoy-sec-t { flex: none; background: none; border: 0; padding: 0 4px 0 0; margin: 0; font: inherit; font-size: 15px; line-height: 1; color: inherit; cursor: pointer; }
.hoy-sec-t:hover { color: var(--accent, #2f6fd6); }

/* Ficha de cliente de marketing: encabezado del color del cliente, portada y bloques plegables */
.mk-head { background: var(--hc, #6b4fd6); color: #fff; }
.mk-head h1, .mk-head .subtitle, .mk-head .muted { color: #fff; opacity: .95; }
.mk-head .btn { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.5); color: #fff; }
.mk-cover { position: relative; max-height: 260px; overflow: hidden; background: #000; }
.mk-cover img { display: block; width: 100%; max-height: 260px; object-fit: cover; }
.mk-cover .btn { position: absolute; right: 12px; bottom: 12px; }
.mk-fold .av-card-h h3 { display: flex; align-items: center; gap: 6px; }
.mk-fold-body[hidden] { display: none; }
.mk-fold.is-closed .av-card-h { margin-bottom: 0; }

/* Ficha de marketing: portada reencuadrable, tablas de pagos y métricas, agarre de la lista */
.mk-cover { cursor: grab; touch-action: none; user-select: none; }
.mk-cover:active { cursor: grabbing; }
.mk-cover img { user-select: none; -webkit-user-drag: none; }
.mk-cover-hint { position: absolute; left: 12px; bottom: 12px; background: rgba(0,0,0,.55); color: #fff; font-size: 12px; padding: 4px 9px; border-radius: 999px; pointer-events: none; }
.mk-pay-tbl td, .mk-pay-tbl th { white-space: nowrap; vertical-align: middle; }
.mk-pay-tbl th.num, .mk-pay-tbl td.num { text-align: right; }
.mk-pay-tbl th.ck, .mk-pay-tbl td.ck { text-align: center; width: 64px; }
.mk-pay-tbl td.nw { white-space: nowrap; }
.mk-net-tabs { margin-bottom: 10px; }
.mk-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 10px 0 14px; }
.mk-kpi { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.mk-kpi span { font-size: 12px; color: var(--muted); }
.mk-kpi b { font-size: 20px; }
.mk-kpi em { font-style: normal; font-size: 12px; color: var(--muted); }
.mk-kpi.pos b, .mk-kpi.pos em { color: #1f8a5b; }
.mk-kpi.neg b, .mk-kpi.neg em { color: #c2417a; }
.mk-grip-h { width: 28px; }
.mk-grip-cell { width: 28px; text-align: center; }
.mk-grip { display: inline-block; cursor: grab; color: var(--muted); font-size: 18px; line-height: 1; letter-spacing: -2px; }

/* Trofeos: filtro por empleado y ficha del entregable */
.tr-who-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.tr-who { flex-wrap: wrap; }
.tr-info { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; margin: 10px 0 14px; text-align: left; }
.tr-info dt { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 600; }
.tr-info dd { margin: 0; font-weight: 600; }

/* Nuestro equipo: una tarjeta por persona */
.tm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 18px; align-items: start; }
.tm-card { padding: 0; overflow: hidden; border-radius: 18px; }
.tm-hero { position: relative; display: flex; align-items: center; gap: 14px; padding: 18px 18px 16px; color: #fff;
  background: radial-gradient(circle at 22% 18%, rgba(255, 255, 255, .28), transparent 42%), radial-gradient(circle at 88% 82%, rgba(0, 0, 0, .18), transparent 46%), linear-gradient(160deg, color-mix(in srgb, var(--cc) 85%, #fff) 0%, var(--cc) 55%, color-mix(in srgb, var(--cc) 62%, #000) 100%); }
.tm-av { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 19px; background: rgba(255, 255, 255, .22); flex: none; }
.tm-id { display: grid; gap: 2px; min-width: 0; flex: 1; }
.tm-id b { font-size: 18px; }
.tm-id span { font-size: 13px; opacity: .9; }
.tm-edit { background: rgba(255, 255, 255, .92); color: #1b1a17; border: 0; border-radius: 99px; padding: 5px 11px; font-size: 12px; font-weight: 700; cursor: pointer; }
.tm-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--border); }
.tm-stats > div { background: var(--panel, #fff); padding: 10px 6px; text-align: center; display: grid; gap: 2px; }
.tm-stats span { font-size: 17px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--cc); }
.tm-stats small { font-size: 10.5px; color: var(--muted); line-height: 1.2; }
details.tm-fold { border-top: 1px solid var(--border); }
details.tm-fold > summary { list-style: none; cursor: pointer; user-select: none; display: flex; align-items: center; gap: 8px; padding: 11px 16px; }
details.tm-fold > summary::-webkit-details-marker { display: none; }
details.tm-fold[open] > summary .fold-chev { transform: rotate(90deg); }
.tm-count { margin-left: auto; font-size: 12px; font-weight: 700; padding: 1px 9px; border-radius: 999px; background: color-mix(in srgb, var(--cc) 14%, #fff); color: var(--cc); }
.tm-fold-b { padding: 0 16px 14px; }
.tm-rows { display: grid; gap: 0; }
.tm-row { display: grid; grid-template-columns: 110px 1fr; gap: 10px; padding: 7px 0; border-bottom: 1px dashed var(--border); font-size: 14px; }
.tm-l { color: var(--muted); font-size: 12.5px; }
.tm-v { font-weight: 600; word-break: break-word; }
.tm-sub { font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; margin: 8px 0 6px; }
.tm-legal { display: grid; gap: 6px; }
.tm-doc { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 7px 9px; border: 1px solid var(--border); border-radius: 10px; }
.tm-doc-t { font-weight: 600; flex: 1; min-width: 120px; }
.tm-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.tm-list li { display: grid; gap: 1px; padding: 7px 10px; border-radius: 10px; background: color-mix(in srgb, var(--cc) 7%, #fff); font-size: 14px; }
@media (max-width: 640px) { .tm-grid { grid-template-columns: 1fr; } .tm-row { grid-template-columns: 1fr; gap: 2px; } }

/* Comprobantes de contabilidad */
.acc-proof { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-size: 13px; padding: 8px 10px; border: 1px dashed var(--border); border-radius: 10px; color: var(--muted); white-space: nowrap; overflow: hidden; max-width: 100%; }
.acc-proof:hover { color: var(--text); border-color: var(--muted); }
.proof-link { text-decoration: none; }
.proof-box { display: grid; gap: 6px; padding: 10px; border: 1px dashed var(--border); border-radius: 12px; }
.proof-l { font-size: 12.5px; color: var(--muted); font-weight: 600; }
.proof-now { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-weight: 600; }

/* Nuestro equipo v2: 4 por fila en computador, 2 en tableta, 1 en celular; tarjeta plegable; elementos clicables */
.tm-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .tm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .tm-grid { grid-template-columns: minmax(0, 1fr); } }
.tm-chev { flex: none; width: 28px; height: 28px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .22); color: #fff; font-size: 13px; cursor: pointer; transition: transform .15s; }
.tm-card.collapsed .tm-chev { transform: rotate(-90deg); }
.tm-card.collapsed > :not(.tm-hero) { display: none; }
.tm-card.collapsed { align-self: start; }
.tm-id b, .tm-id span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-click { cursor: pointer; transition: background .12s; }
.tm-click:hover { background: color-mix(in srgb, var(--cc) 20%, #fff); }

/* Inventario: más aire entre equipos y categorías; categorías desplegables; íconos propios */
.cat-ico { width: 22px; height: 22px; object-fit: contain; vertical-align: middle; display: inline-block; }
.inv-icon .cat-ico { width: 30px; height: 30px; }
details.inv-cat { margin-top: 26px; }
details.inv-cat:first-child { margin-top: 0; }
details.inv-cat > summary.inv-cat-h { list-style: none; cursor: pointer; user-select: none; display: flex; align-items: center; gap: 10px; margin: 0 0 16px 4px; padding: 6px 4px; font-size: 15px; }
details.inv-cat > summary.inv-cat-h::-webkit-details-marker { display: none; }
details.inv-cat[open] > summary .fold-chev { transform: rotate(90deg); }
.inv-cat-n { margin-left: auto; font-size: 12px; font-weight: 700; padding: 2px 10px; border-radius: 99px; background: rgba(0, 0, 0, .06); color: var(--muted); }
details.inv-cat .inv-cards { gap: 14px; }
.inv-card { padding: 16px 16px 16px 20px; gap: 16px; }

/* Cotizaciones: aviso de envío y sección de enviadas */
.quote-group.qg-sent { --qg: #2f6fd6; --qg-bg: #e8effc; --qg-ink: #2453a8; }
.qc-sent { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; padding: 3px 9px; border-radius: 999px; background: #e8effc; color: #2453a8; align-self: flex-start; }
.sent-list { display: grid; gap: 8px; padding: 0 14px 14px; }
.sent-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 14px; border: 1px solid #b9cdf3; border-left: 4px solid #2f6fd6; border-radius: 12px; background: #fff; cursor: pointer; }
.sent-row:hover, .sent-row:focus-visible { box-shadow: 0 6px 16px -10px #2f6fd6; outline: none; }
.sent-main { display: grid; gap: 2px; min-width: 0; }
.sent-side { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sent-date, .sent-n { font-size: 12.5px; color: var(--muted); }

/* Documentos de Rowly: panel centrado y alineado */
.rd-main { padding-top: 22px; }
.rd-wrap { max-width: 920px; margin: 0 auto; }
.rd-panel { padding: 20px 22px 22px; margin: 0; }
.rd-panel .sub-label { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 0 0 12px; }
.rd-panel .doc-list { margin: 0 0 14px; }
.rd-panel .doc-row { padding: 10px 12px; }
.rd-panel .doc-upload { margin-top: 2px; }

/* ===== Brief Vivo en el dashboard Master ===== */
.bm-grupo { margin: 0 0 28px; }
.bm-grupo h2 { font-size: 18px; margin: 0 0 12px; display: flex; gap: 10px; align-items: baseline; }
.bm-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.bm-card { background: #fff; border: 1px solid #e3ddd0; border-radius: 14px; padding: 16px; display: grid; gap: 10px; }
.bm-cab { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.bm-cab > div { display: grid; gap: 2px; }
.bm-marca { font-size: 16px; }
.bm-estado { font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: #eee; white-space: nowrap; }
.bm-activo { background: #d9f2e1; }
.bm-por_vencer { background: #fdeccb; }
.bm-vencido { background: #f7d4d4; }
.bm-datos { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 14px; color: #5b5549; }
.bm-alertas { display: flex; flex-wrap: wrap; gap: 6px; }
.bm-alertas span { font-size: 12px; background: #f3efe6; padding: 3px 9px; border-radius: 999px; }
.bm-ficha { font-weight: 600; text-decoration: none; color: inherit; }
@media (max-width: 1100px) { .bm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .bm-grid { grid-template-columns: 1fr; } }

/* ===== Brief Vivo en el dashboard Master ===== */
.bm-grupo { margin: 0 0 28px; }
.bm-grupo h2 { font-size: 18px; margin: 0 0 12px; display: flex; gap: 10px; align-items: baseline; }
.bm-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.bm-card { background: #fff; border: 1px solid #e3ddd0; border-radius: 14px; padding: 16px; display: grid; gap: 10px; }
.bm-cab { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.bm-cab > div { display: grid; gap: 2px; }
.bm-marca { font-size: 16px; }
.bm-estado { font-size: 12px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: #eee; white-space: nowrap; }
.bm-activo { background: #d9f2e1; }
.bm-por_vencer { background: #fdeccb; }
.bm-vencido { background: #f7d4d4; }
.bm-datos { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 14px; color: #5b5549; }
.bm-alertas { display: flex; flex-wrap: wrap; gap: 6px; }
.bm-alertas span { font-size: 12px; background: #f3efe6; padding: 3px 9px; border-radius: 999px; }
.bm-ficha { font-weight: 600; text-decoration: none; color: inherit; }
@media (max-width: 1100px) { .bm-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .bm-grid { grid-template-columns: 1fr; } }

/* Entregables y resumen del brief (Master) */
.mk-ent { font-size: 12px; font-weight: 600; color: var(--muted); padding: 0 14px 10px; }
.brief-modal { max-width: 720px; }
.br-bloque { margin: 14px 0; }
.br-bloque h4 { margin: 0 0 6px; font-size: 15px; }
.br-bloque p { margin: 0; line-height: 1.5; }
.br-lista { margin: 0; padding-left: 18px; display: grid; gap: 6px; line-height: 1.45; }
.br-tabla { width: 100%; border-collapse: collapse; font-size: 14px; }
.br-tabla th, .br-tabla td { text-align: left; padding: 6px 8px; border-bottom: 1px solid #e3ddd0; vertical-align: top; }
.br-tabla th { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: #6d675d; }

/* ===== Cajitas de entregables e historias (Master, igual que el portal de Sara) ===== */
.cajitas-m { display: grid; gap: 10px; }
.cajitas-m .cajitas-cab { font-size: 12.5px; color: var(--muted); }
.cajitas-m .cajitas-tabs { display: flex; gap: 8px; flex-wrap: wrap; }
.cajitas-m .chip { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--border); background: var(--card); cursor: pointer; font-size: 13px; }
.cajitas-m .chip.activo { background: var(--accent); color: #fff; border-color: var(--accent); }
.cajitas-m .cajitas-filtros { display: flex; gap: 6px; flex-wrap: wrap; }
.cajitas-m .cajitas-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.caja-ent { background: var(--panel); border: 1px solid var(--border); border-left: 4px solid var(--border); border-radius: 12px; padding: 9px; display: flex; flex-direction: column; gap: 7px; cursor: pointer; min-width: 0; }
.caja-ent:hover, .caja-ent:focus-visible { border-color: var(--accent); outline: none; }
.caja-ent.tipo-reel { background: #EFE9FD; border-color: #B9A6F0; }
.caja-ent.ent-subido { background: #DDF5E6; border-color: #2F9E5F; }
.caja-ent.tipo-carrusel { background: #FFEBDD; border-color: #F5A56F; }
.caja-ent.est-pendiente { background: #FFF6CC; border-color: #E9C94A; }
.caja-ent.est-subida { background: #DDF5E6; border-color: #5FBE8A; }
.caja-ent.est-vencida { background: #FBDADB; border-color: #E0686E; }
.caja-top { display: flex; gap: 8px; align-items: flex-start; min-width: 0; }
.caja-top > div { display: grid; min-width: 0; }
.caja-top b { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.caja-ic { font-size: 16px; line-height: 1.2; }
.caja-meta { display: flex; justify-content: space-between; gap: 6px; font-size: 11.5px; color: var(--muted); flex-wrap: wrap; }
.caja-link { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.caja-ficha { display: grid; grid-template-columns: max-content 1fr; gap: 6px 14px; margin: 8px 0; font-size: 14px; }
.caja-ficha dt { color: var(--muted); font-weight: 600; }
.caja-ficha dd { margin: 0; overflow-wrap: anywhere; }

/* ===== Avisos de Brief Vivo (cambios que hace Sara en su portal) ===== */
.avisos-btn { position: fixed; right: 16px; bottom: 16px; z-index: 60; display: flex; align-items: center; gap: 6px; padding: 10px 14px; border: 1px solid var(--line, #ddd); border-radius: 999px; background: #fff; color: var(--ink, #111); box-shadow: 0 8px 24px -12px rgba(0, 0, 0, .35); font: inherit; cursor: pointer; }
.avisos-btn .avisos-n { min-width: 20px; padding: 1px 6px; border-radius: 999px; background: #c23a47; color: #fff; font-size: 12px; text-align: center; }
.avisos-panel { position: fixed; right: 16px; bottom: 64px; z-index: 61; width: min(360px, calc(100vw - 32px)); max-height: 60vh; overflow: auto; background: #fff; border: 1px solid var(--line, #ddd); border-radius: 16px; box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .4); padding: 10px; }
.avisos-panel[hidden] { display: none; }
.avisos-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 6px 8px; }
.avisos-cab button { border: 0; background: none; color: var(--accent, #6b4fd6); font: inherit; font-size: 13px; cursor: pointer; }
.aviso { display: grid; gap: 2px; width: 100%; text-align: left; padding: 9px 10px; border: 0; border-radius: 10px; background: transparent; font: inherit; cursor: pointer; }
.aviso:hover { background: #f4f1ec; }
.aviso.nuevo { background: #f1ecfb; }
.aviso span { font-size: 14px; }
.aviso em { font-style: normal; font-size: 12px; color: #6f685e; }
.avisos-vacio { color: #6f685e; font-size: 14px; padding: 8px 6px; margin: 0; }

/* ===== Páginas de Brief dentro de la app (vista de Sara) ===== */
.brief-main { padding: 0; }
.brief-frame { display: block; width: 100%; height: calc(100vh - 110px); min-height: 480px; border: 0; background: transparent; }

/* Proyecto terminado: solo lectura. Se reabre con el botón "Reabrir proyecto". */
.proj-locked main button:not([data-reopen]):not([data-dview]):not([data-fold]),
.proj-locked main input:not([type="hidden"]),
.proj-locked main select,
.proj-locked main textarea { pointer-events: none; opacity: .75; }
.proj-locked main a { pointer-events: auto; }

/* Contabilidad: ver a una persona (solo lectura de sus movimientos) */
.acc-persona .acc-add { display: none; }
.acc-who { margin: 0 0 12px; }
.acc-viat-pick { padding: 8px 14px; }

/* Brief dentro de Rowly (ficha de Marketing): cinco secciones desplegables con el mismo estilo de tarjeta */
.brief-tpl { display: flex; flex-direction: column; gap: 12px; }
.brief-tpl > .av-card-h { margin-bottom: 4px; }
.brief-sec { background: var(--card, #fff); border: 1px solid var(--border, #e7e1d6); border-radius: 16px; padding: 0 20px; box-shadow: 0 2px 10px rgba(0,0,0,.05); }
.brief-sec > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; min-height: 58px; font-size: 17px; }
.brief-sec > summary::-webkit-details-marker { display: none; }
.brief-sec > summary .brief-chev { margin-left: auto; font-size: 22px; transition: transform .15s; }
.brief-sec[open] > summary .brief-chev { transform: rotate(90deg); }
.brief-sec > p { margin: 0 0 16px; }
.brief-body { margin: 0 0 16px; }
.brief-body .mk-scroll { padding: 0; }
.stat-redes { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin: 8px 0 12px; }
.stat-red { border: 1px solid #e3ddd0; border-radius: 12px; padding: 12px; display: grid; gap: 4px; }
.stat-red-nombre { font-size: 14px; font-weight: 600; display: flex; align-items: center; gap: 6px; }
.stat-red-nombre small { font-weight: 400; color: #6d675d; }
.stat-hoy { font-size: 24px; }
.stat-cambio { font-size: 13px; }
.stat-cambio.sube { color: #2f7d4f; }
.stat-cambio.baja { color: #b03a2e; }
.marca-red { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--red, #888); }
.red-instagram { --red: #c13584; }
.red-tiktok { --red: #111111; }
.red-youtube { --red: #c4302b; }
/* Ficha de Marketing para PM: el mismo diseño de la ficha de Brief Vivo (Lumbre Yoga).
   Los colores y formas vienen de los tokens de Brief Vivo, solo dentro de .mk-pm. */
.mk-pm {
  --bg: #efebe4; --surface: #ffffff; --surface-2: #e9e4db; --ink: #161412; --muted: #6f685e; --line: #ddd6ca;
  --accent: #1c1a17; --accent-ink: #ffffff; --accent-soft: #e6e0d6; --mint: #d9efe3; --lilac: #e4dcf5; --butter: #f6ecc4;
  --rec: #c23a47; --ok: #1f9d63; --warn: #a8701a;
  --display: "Montserrat", "Helvetica Neue", Arial, sans-serif; --mono: ui-monospace, Consolas, monospace;
  --shadow: 0 2px 10px rgba(0, 0, 0, .05);
  max-width: 1200px; margin: 0 auto; padding: 14px 16px 40px; color: var(--ink);
}
.mk-pm .volver { display: inline-flex; gap: 4px; align-items: center; font-weight: 600; font-size: 14px; color: var(--muted); text-decoration: none; }
.mk-pm .ficha-cabeza { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.mk-pm .ficha-titulo { flex: 1; min-width: 240px; display: grid; gap: 6px; }
.mk-pm .ficha-titulo h2 { margin: 0; font-family: var(--display); font-size: clamp(28px, 4vw, 40px); font-weight: 800; letter-spacing: -.03em; }
.mk-pm .ficha-titulo p { margin: 0; color: var(--muted); overflow-wrap: anywhere; }
.mk-pm .chips-fila { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.mk-pm .tc-avatar { width: 72px; height: 72px; flex: none; display: grid; place-items: center; font-family: var(--display); font-weight: 800; font-size: 30px; background: var(--mint); border-radius: 54% 46% 50% 50% / 50% 54% 46% 50%; }
.mk-pm .pill { color: #161412; display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 99px; font-size: 12.5px; font-weight: 600; background: var(--surface-2); white-space: nowrap; }
.mk-pm .pill.sus-activo { background: color-mix(in srgb, var(--ok) 18%, var(--surface)); color: var(--ok); }
.mk-pm .pill.sus-vencido { background: color-mix(in srgb, var(--rec) 16%, var(--surface)); color: var(--rec); }
.mk-pm .pestanas { display: inline-flex; gap: 4px; flex-wrap: wrap; padding: 5px; background: var(--surface); border-radius: 999px; margin: 14px 0 18px; max-width: 100%; }
.mk-pm .pestana { padding: 9px 18px; border-radius: 999px; border: 0; background: none; cursor: pointer; color: var(--muted); font: inherit; font-weight: 600; font-size: 14.5px; }
.mk-pm .pestana:hover { color: var(--ink); }
.mk-pm .pestana.activa { background: var(--ink); color: var(--bg); }
.mk-pm .rejilla-marca { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; align-items: start; margin-bottom: 14px; }
.mk-pm .rejilla-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.mk-pm .rejilla-4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; margin-top: 6px; }
.mk-pm .ancho-2 { grid-column: span 2; }
@media (max-width: 760px) { .mk-pm .ancho-2 { grid-column: auto; } }

/* Bloques de la ficha (Contacto, Información, Expediente, Parrilla...) */
.mk-pm .bloque-ficha { background: var(--surface); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); margin: 0 0 14px; overflow: hidden; }
.mk-pm .rejilla-marca > .bloque-ficha { margin: 0; }
.mk-pm .bloque-cab { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 14px 18px; cursor: pointer; list-style: none; user-select: none; }
.mk-pm .bloque-cab::-webkit-details-marker { display: none; }
.mk-pm .bloque-cab h2 { margin: 0; font-size: 17px; font-family: var(--display); }
.mk-pm .bloque-cab .nota { flex: 1 1 200px; margin: 0; }
.mk-pm .bloque-cab .flecha { width: 10px; height: 10px; flex: none; margin-left: auto; background: none; border-radius: 0; display: block; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .2s; }
.mk-pm .bloque-cab .flecha::before { content: none; }
.mk-pm .bloque-ficha[open] > .bloque-cab .flecha { transform: rotate(225deg); }
.mk-pm .bloque-cuerpo { padding: 0 18px 18px; display: grid; gap: 12px; }
.mk-pm .bloque-cuerpo .av-dl { margin: 0; }
.mk-pm .mk-pm-foto { width: 96px; height: 96px; object-fit: cover; border-radius: 14px; margin-bottom: 4px; }
.mk-pm .mk-info-dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px 18px; margin: 0; }
.mk-pm .mk-info-row dt { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.mk-pm .mk-info-row dd { margin: 3px 0 0; font-weight: 600; word-break: break-word; }
.mk-pm .cajitas-m { margin-top: 4px; }
/* Ficha de Brief Vivo dentro de la vista de PM: alto de la pantalla, con su propio desplazamiento */
.mk-pm .mk-brief-frame { display: block; width: 100%; height: calc(100vh - 24px); min-height: 640px; border: 0; border-radius: 24px; background: #F1F4EC; }
.mk-pm .modal-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-start; }
.mk-pm .exp-barra { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.mk-pm .exp-barra .empuje { flex: 1; }
.mk-pm .exp-lista { display: grid; gap: 10px; }
.mk-pm .etiqueta { font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.mk-pm .nota { font-size: 13.5px; color: var(--muted); margin: 0; }

/* Secciones plegables del expediente */
.mk-pm .exp-plegable { display: block; border-radius: 24px; background: var(--bg); }
.mk-pm .exp-sum { display: flex; align-items: center; gap: 12px; padding: 16px 20px; cursor: pointer; list-style: none; border-radius: 24px; }
.mk-pm .exp-sum::-webkit-details-marker { display: none; }
.mk-pm .exp-sum:hover { background: var(--surface-2); }
.mk-pm .exp-h { flex: 1; margin: 0; font-family: var(--display); font-size: clamp(18px, 2.4vw, 24px); font-weight: 750; letter-spacing: -.02em; }
.mk-pm .flecha { width: 34px; height: 34px; flex: none; border-radius: 50%; background: var(--surface); display: grid; place-items: center; transition: transform .25s ease; }
.mk-pm .flecha::before { content: ''; width: 9px; height: 9px; border-right: 2.5px solid var(--ink); border-bottom: 2.5px solid var(--ink); transform: translateY(-2px) rotate(45deg); }
.mk-pm .exp-plegable[open] > .exp-sum .flecha { transform: rotate(180deg); }
.mk-pm .exp-cuerpo { display: grid; gap: 14px; padding: 0 20px 20px; }
.mk-pm .exp-contenido { display: grid; gap: 14px; }
.mk-pm .exp-intro { max-width: 70ch; margin: 0; }
.mk-pm .exp-resumen { display: grid; gap: 14px; padding: clamp(22px, 4vw, 36px); border-radius: 40px 40px 40px 14px; background: var(--ink); color: var(--bg); }
.mk-pm .exp-resumen > p { margin: 0; font-family: var(--display); font-size: clamp(19px, 2.4vw, 24px); line-height: 1.35; font-weight: 500; max-width: 60ch; }
.mk-pm .mensaje-central { display: grid; gap: 4px; padding: 16px 18px; border-radius: 20px 20px 20px 6px; background: var(--accent); color: var(--accent-ink); }
.mk-pm .mensaje-central .sub-h { color: inherit; opacity: .7; }
.mk-pm .mensaje-central strong { font-family: var(--display); font-size: 20px; line-height: 1.3; }
.mk-pm .sub-h { font-family: var(--display); font-size: 19px; font-weight: 700; letter-spacing: -.01em; margin: 0 0 6px; color: var(--ink); }
.mk-pm .sub-h.si { color: var(--ok); }
.mk-pm .sub-h.no { color: var(--warn); }
.mk-pm .tarjeta-lateral { background: var(--surface); border-radius: 28px 28px 28px 10px; padding: 22px; display: grid; gap: 14px; align-content: start; }
.mk-pm .tarjeta-lateral p { margin: 0; }
.mk-pm .tarjeta-lateral > .sub-h:not(:first-child) { margin-top: 12px; }
.mk-pm .destacada-op { background: color-mix(in srgb, var(--mint) 55%, var(--surface)); }
.mk-pm .lista-exp { margin: 4px 0 0; padding-left: 18px; display: grid; gap: 4px; }
.mk-pm .lista-exp li { overflow-wrap: anywhere; }
.mk-pm .palabras { display: flex; flex-wrap: wrap; gap: 6px; }
.mk-pm .palabras span { padding: 4px 10px; border-radius: 99px; background: var(--surface-2); font-size: 13px; }
.mk-pm .citas { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.mk-pm .cita { margin: 0; display: grid; gap: 8px; padding: 18px; border-radius: 24px 24px 24px 8px; background: color-mix(in srgb, var(--lilac) 45%, var(--surface)); }
.mk-pm .cita blockquote { margin: 0; font-family: var(--display); font-size: 17px; line-height: 1.35; font-weight: 500; }
.mk-pm .cita figcaption { font-size: 13px; color: var(--muted); }
.mk-pm .alertas-columnas { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; align-items: start; }
.mk-pm .columna-alertas { display: grid; gap: 10px; padding: 14px; border-radius: 20px; background: var(--bg); }
.mk-pm .columna-alertas .sub-h { display: flex; align-items: center; gap: 8px; margin: 0; }
.mk-pm .conteo { font-family: var(--mono); font-size: 13px; font-weight: 500; padding: 2px 9px; border-radius: 99px; background: var(--surface); color: var(--muted); }
.mk-pm .alerta-exp { display: flex; padding: 14px 16px; border-radius: 18px; background: var(--surface); box-shadow: inset 4px 0 0 var(--warn); }
.mk-pm .alerta-exp p { margin: 0; }
.mk-pm .alerta-exp.tipo-contradiccion { box-shadow: inset 4px 0 0 var(--rec); }
.mk-pm .alerta-exp.tipo-dato_faltante { box-shadow: inset 4px 0 0 var(--muted); }
.mk-pm .tabla-objetivos { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--surface); border-radius: 18px; overflow: hidden; }
.mk-pm .tabla-objetivos th { text-align: left; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; padding: 12px 14px; background: color-mix(in srgb, var(--accent-soft) 70%, var(--surface)); vertical-align: bottom; }
.mk-pm .tabla-objetivos th small { display: block; text-transform: none; letter-spacing: 0; font-weight: 400; font-size: 12px; color: var(--muted); }
.mk-pm .tabla-objetivos td { padding: 14px; vertical-align: top; font-size: 14.5px; line-height: 1.4; border-top: 1px solid color-mix(in srgb, var(--ink) 10%, transparent); }
.mk-pm .tabla-objetivos td + td, .mk-pm .tabla-objetivos th + th { border-left: 1px solid color-mix(in srgb, var(--ink) 10%, transparent); }
.mk-pm .tabla-objetivos td.num { font-family: var(--mono); color: var(--muted); width: 1%; text-align: center; white-space: nowrap; }
.mk-pm .tabla-objetivos td.meta { font-weight: 600; background: color-mix(in srgb, var(--mint) 25%, var(--surface)); }
.mk-pm .pilares { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.mk-pm .pilar { display: grid; gap: 10px; align-content: start; padding: 20px; border-radius: 28px 28px 28px 10px; }
.mk-pm .pilar-cabeza { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.mk-pm .pilar h4 { font-family: var(--display); font-size: 20px; font-weight: 700; margin: 0; letter-spacing: -.01em; }
.mk-pm .pilar-cabeza strong { font-family: var(--display); font-size: 28px; font-weight: 800; }
.mk-pm .pilar-barra { height: 6px; border-radius: 99px; background: color-mix(in srgb, var(--ink) 12%, transparent); overflow: hidden; }
.mk-pm .pilar-barra i { display: block; height: 100%; background: var(--ink); border-radius: inherit; }
.mk-pm .pilar p { margin: 0; }
.mk-pm .pastilla-exp { padding: 3px 10px; border-radius: 99px; font-size: 12.5px; font-weight: 600; background: color-mix(in srgb, var(--surface) 70%, transparent); }
.mk-pm .color-mint { background: color-mix(in srgb, var(--mint) 70%, var(--surface)); }
.mk-pm .color-lilac { background: color-mix(in srgb, var(--lilac) 70%, var(--surface)); }
.mk-pm .color-butter { background: color-mix(in srgb, var(--butter) 70%, var(--surface)); }
.mk-pm .color-acento { background: color-mix(in srgb, var(--accent-soft) 85%, var(--surface)); }
.mk-pm .color-verde { background: color-mix(in srgb, var(--ok) 20%, var(--surface)); }
.mk-pm .punto-pilar { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--ink) 25%, transparent); }
.mk-pm .ejemplo { padding: 10px 14px; border-radius: 14px; font-style: italic; margin: 0; }
.mk-pm .ejemplo.bien { background: color-mix(in srgb, var(--ok) 12%, var(--surface)); }
.mk-pm .ejemplo.mal { background: color-mix(in srgb, var(--rec) 10%, var(--surface)); text-decoration: line-through; }
.mk-pm .preguntas-pm { margin: 0; padding: 0; list-style: none; counter-reset: q; display: grid; gap: 10px; }
.mk-pm .preguntas-pm li { counter-increment: q; display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: start; padding: 14px 16px; background: var(--surface); border-radius: 18px; }
.mk-pm .preguntas-pm li::before { content: counter(q); font-family: var(--mono); font-weight: 700; color: var(--muted); }
.mk-pm .mk-scroll { overflow-x: auto; overflow-y: visible; max-height: none; padding: 0; }
@media (max-width: 640px) {
  .mk-pm .tc-avatar { width: 56px; height: 56px; font-size: 24px; }
  .mk-pm .rejilla-marca { grid-template-columns: 1fr; }
  .mk-pm .exp-cuerpo { padding: 0 14px 16px; }
}

/* Dashboard de PM: el texto de las pastillas siempre se lee (antes heredaba el blanco de la app) */
.mk-pm .pill, .mk-pm .chips-fila .pill, .mk-pm .ficha-titulo .pill { color: #161412; }
.mk-pm .tabs-tareas-pm { margin: 4px 0 12px; }

/* Formulario del acuerdo de servicios (tarjeta del cliente) */
.acuerdo-form label { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; font-size: 13px; }
.acuerdo-form input, .acuerdo-form textarea { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid #d8d2c6; border-radius: 8px; font: inherit; background: #fff; }
.acuerdo-form fieldset { border: 1px solid #e6e0d4; border-radius: 12px; padding: 12px 14px; margin: 0 0 12px; }
.acuerdo-form legend { font-weight: 700; padding: 0 6px; }
.acuerdo-acciones { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.acuerdo-vista .acuerdo-seccion { margin-top: 14px; }

.brief-pendiente[hidden] { display: none !important; }
.brief-pendiente { background: #FFE6CC; color: #7A3E00; }

/* Mensajes (Rowly) */
.mensajes-app { display: grid; grid-template-columns: minmax(220px, 300px) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 760px) { .mensajes-app { grid-template-columns: 1fr; } }
.mensajes-lista { display: flex; flex-direction: column; gap: 8px; max-height: 620px; overflow-y: auto; }
.ms-cliente { display: flex; flex-direction: column; gap: 4px; text-align: left; padding: 12px 14px; border-radius: 14px; border: 1px solid #e6e0d4; background: #fff; cursor: pointer; font: inherit; }
.ms-cliente.activo { border-color: #161412; box-shadow: inset 3px 0 0 #161412; }
.ms-cliente strong { font-size: 14px; }
.mensajes-chat { background: #fff; border-radius: 18px; padding: 18px; display: flex; flex-direction: column; gap: 12px; min-height: 320px; }
.ms-cab { display: flex; flex-direction: column; gap: 2px; border-bottom: 1px solid #efe9de; padding-bottom: 10px; }
.ms-hilo { display: flex; flex-direction: column; gap: 10px; max-height: 420px; overflow-y: auto; }
.msg { max-width: 80%; padding: 10px 14px; border-radius: 16px; background: #f1ede6; }
.msg.msg-equipo { align-self: flex-end; background: #161412; color: #fff; }
.msg.msg-cliente { align-self: flex-start; }
.msg p { margin: 2px 0 4px; line-height: 1.5; }
.msg-autor { font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; opacity: .7; }
.msg small { font-size: 11px; opacity: .6; }
.form-mensaje { display: flex; flex-direction: column; gap: 8px; }
.form-mensaje textarea { width: 100%; box-sizing: border-box; padding: 10px 12px; border-radius: 12px; border: 1px solid #d8d2c6; font: inherit; background: #fff; }
.form-mensaje .btn { align-self: flex-end; }
.mensajes-avisos { margin-top: 20px; }
.mensajes-avisos .lista-avisos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.mensajes-avisos .lista-avisos li { display: flex; flex-direction: column; gap: 3px; padding: 10px 12px; border-radius: 12px; background: #fff; line-height: 1.45; }
.mensajes-avisos .lista-avisos li.sin-leer { box-shadow: inset 3px 0 0 #FF6A3D; }
.mensajes-avisos .lista-avisos small { font-size: 11px; opacity: .6; }

/* Pagos por revisar (Contabilidad de Master) */
.pagos-clientes { background: #fff; border-radius: 16px; padding: 16px 18px; margin-bottom: 18px; }
.tabla-pagos { width: 100%; border-collapse: collapse; font-size: 13px; }
.tabla-pagos th, .tabla-pagos td { padding: 9px 10px; border-bottom: 1px solid #efe9de; text-align: left; vertical-align: middle; }
.tabla-pagos .pago-acciones { white-space: nowrap; }
.tabla-pagos .pago-acciones .btn { margin-right: 4px; }
.pill.pago-revision { background: #DCE9FF; color: #1D4ED8; }
.pill.pago-aprobado { background: #DDF5E6; color: #1B7A43; }
.pill.pago-rechazado { background: #FDE2E2; color: #B42318; }

/* Mensajes: márgenes y notificaciones con botón de borrar */
.mensajes-cab { margin-bottom: 18px; }
.mensajes-app { margin-top: 4px; padding-bottom: 8px; }
.mensajes-chat { padding: 20px 22px; }
.mensajes-avisos { margin-top: 24px; padding-top: 4px; }
.avisos-cab-portal { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 12px; }
.avisos-cab-portal .enlace { background: none; border: 0; font: inherit; cursor: pointer; text-decoration: underline; color: inherit; padding: 0; }
.aviso-fila-portal { display: flex; align-items: center; gap: 10px; }
.aviso-fila-portal .aviso-texto { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.aviso-fila-portal .aviso-borrar { border: 0; background: transparent; font-size: 18px; cursor: pointer; opacity: .55; padding: 0 6px; }
.aviso-fila-portal .aviso-borrar:hover { opacity: 1; }

/* Mensajes: márgenes de la página */
.mensajes-pagina { padding: 28px 32px 48px; max-width: 1240px; }
@media (max-width: 640px) { .mensajes-pagina { padding: 18px 16px 40px; } }
/* Botón para volver a Marketing: más grande */
.mk-pm .volver { font-size: 17px; padding: 10px 18px; border-radius: 999px; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.08); color: var(--ink, #161412); }

/* Estados de ciclo y pago (tarjeta del cliente en Master) */
.pill.cuenta-pagado { background: #DDF5E6; color: #1B7A43; }
.pill.cuenta-pendiente { background: #FFF3C4; color: #7A5A00; }
.pill.cuenta-revision { background: #DCE9FF; color: #1D4ED8; }
.pill.cuenta-vencido, .pill.cuenta-rechazado { background: #FDE2E2; color: #B42318; }
/* Acuerdo: firmas y acciones */
.acciones-acuerdo { flex-wrap: wrap; gap: 8px; }
.firma-vista { display: block; max-width: 220px; margin-top: 8px; border: 1px dashed #d8d2c6; border-radius: 8px; padding: 6px; background: #fff; }
.bloque-acuerdo label { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; font-size: 13px; }
.bloque-acuerdo .campo { padding: 8px 10px; border-radius: 8px; border: 1px solid #d8d2c6; font: inherit; width: 100%; box-sizing: border-box; }

/* Letrero de estado en la tarjeta del cliente de marketing (Activo, Pendiente o En mora) */
.mk-flag.activo { color: #1B7A43; background: #DDF5E6; }
.mk-flag.pendiente { color: #7A5A00; background: #FFF3C4; }
.mk-flag.deuda { color: #B42318; background: #FDE2E2; }

/* Contratos de clientes en Documentos: cada cliente se pliega y se despliega */
.rd-wrap { display: flex; flex-direction: column; gap: 18px; }
.rd-panel { border-radius: 18px; box-shadow: 0 1px 2px rgba(20, 18, 14, .04), 0 8px 24px rgba(20, 18, 14, .05); }
.rd-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.rd-cab .sub-h { margin: 0; }
.rd-total { font-size: 12.5px; color: var(--muted); }
.rd-cliente { border: 1px solid #e6dfd2; border-radius: 14px; margin-bottom: 10px; background: #fffdf9; overflow: hidden; }
.rd-cliente > summary { list-style: none; display: flex; align-items: center; gap: 12px; padding: 12px 14px; cursor: pointer; user-select: none; }
.rd-cliente > summary::-webkit-details-marker { display: none; }
.rd-cliente > summary:hover { background: #f6f1e8; }
.rd-av { width: 34px; height: 34px; border-radius: 50%; background: var(--accent); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 14px; flex: none; }
.rd-nombre { font-weight: 700; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rd-count { font-size: 12px; font-weight: 700; background: var(--card-2); color: var(--muted); padding: 2px 10px; border-radius: 999px; flex: none; }
.rd-flecha { color: var(--muted); transition: transform .2s; flex: none; }
.rd-cliente[open] > summary .rd-flecha { transform: rotate(180deg); }
.rd-lista { list-style: none; margin: 0; padding: 4px 14px 14px; display: grid; gap: 8px; }
.rd-doc { display: flex; align-items: center; gap: 12px; padding: 10px 12px; background: #fff; border: 1px solid #ece5d8; border-radius: 12px; }
.rd-ico { font-size: 18px; flex: none; }
.rd-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.rd-info a { font-weight: 600; color: var(--text); word-break: break-word; text-decoration: none; }
.rd-info a:hover { text-decoration: underline; }
.rd-tag { font-size: 11.5px; font-weight: 700; background: #DDF5E6; color: #1B7A43; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.rd-borrar { border: 1px solid #f2cdd1; background: transparent; color: #b4545d; font: inherit; font-size: 12.5px; font-weight: 600; padding: 5px 11px; border-radius: 8px; cursor: pointer; flex: none; }
.rd-borrar:hover:not(:disabled) { background: #fdf0f1; }
.rd-borrar:disabled { opacity: .5; cursor: default; }
.rd-vacio { padding: 6px 2px; }
.rd-confirm h3 { margin: 0 0 8px; }
.rd-confirm .sm { margin: 0 0 4px; }
@media (max-width: 600px) { .rd-doc { flex-wrap: wrap; } .rd-borrar, .rd-tag { margin-left: 30px; } }

/* Contratos firmados por el cliente, dentro de la tarjeta del acuerdo (Master y Project Manager) */
.contratos-firmados { margin-top: 10px; border-top: 1px dashed #d9d1c2; padding-top: 8px; }
.contratos-firmados > summary { cursor: pointer; font-weight: 600; font-size: 13px; list-style: none; }
.contratos-firmados > summary::-webkit-details-marker { display: none; }
.contratos-firmados > summary::before { content: '▸ '; color: var(--muted); }
.contratos-firmados[open] > summary::before { content: '▾ '; }
.contratos-firmados ul { margin: 8px 0 0; padding-left: 18px; line-height: 1.8; }
