:root {
  /* Sistema visual HT · premium sobrio: azul HT + grises fríos (slate) + blancos limpios. */
  --bg: #f5f7fb;
  --surface: #ffffff;
  --subtle: #f8fafc;
  --ink: #14213d;
  --ink-2: #475569;
  --ink-3: #64748b;
  --ink-4: #94a3b8;
  --line: #e2e8f0;
  --line-2: #edf1f6;
  --line-hover: #c3ccda;
  --brand: #155eef;
  --brand-ink: #0f49c0;
  --brand-bg: #eaf1ff;
  --brand-100: #d2e0ff;
  --brand-light: #60a5fa;
  --navy: #0b1f3a;
  --rail-bg: #0b1f3a;
  --rail-bg-2: #122b4f;
  --rail-ink: #c6d2e6;
  --rail-ink-2: #8aa0c2;
  --rail-line: rgb(255 255 255 / .08);
  --lock: #d0202f;       /* sin dueño / vencido / incidencia */
  --lock-bg: #fff1f2;
  --lock-line: #fecdd3;
  --wait: #f5b400;
  --wait-bg: #fff8e6;
  --wait-ink: #7a4b00;
  --wait-line: #fde9b0;
  --ok: #15803d;
  --ok-bg: #ecfdf3;
  --ok-line: #abefc6;
  --info: #2563eb;
  --info-bg: #e8efff;
  --violet: #7c3aed;
  --violet-bg: #f1ebff;
  --r-sm: 6px;
  --r: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --shadow: 0 1px 2px rgb(15 23 42 / .05), 0 1px 1px rgb(15 23 42 / .03);
  --shadow-md: 0 4px 12px -4px rgb(15 23 42 / .10), 0 1px 2px rgb(15 23 42 / .05);
  --shadow-lg: 0 16px 36px -14px rgb(15 23 42 / .26), 0 2px 6px rgb(15 23 42 / .06);
  --rail: 248px;
  --ease: cubic-bezier(.16, 1, .3, 1);
  font-family: Onest, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 15px; line-height: 1.45; color: var(--ink); background: var(--bg);
  -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; font-variant-numeric: tabular-nums;
  accent-color: var(--brand); caret-color: var(--brand); scrollbar-color: #cfd4dc transparent;
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
::selection { background: var(--brand); color: #fff; }
body { margin: 0; min-height: 100dvh; background: var(--bg); }
h1, h2, h3, p { margin: 0; }
h1 { font-size: 1.6rem; line-height: 1.15; font-weight: 700; letter-spacing: -.025em; text-wrap: balance; }
h2 { font-size: 1.0667rem; font-weight: 650; letter-spacing: -.012em; }
h3 { font-size: .9333rem; font-weight: 650; }
a { color: inherit; text-underline-offset: 3px; text-decoration-thickness: 1px; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; border-radius: var(--r); }
.boot { padding: 3rem 1.5rem; color: var(--ink-2); }
.muted { color: var(--ink-2); }
.small { font-size: .8667rem; }
.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.bad { color: #b42318; }
.nowrap { white-space: nowrap; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
svg.ic { width: 20px; height: 20px; flex: none; display: block; }

/* ---------- estructura: barra lateral oscura + barra superior ---------- */
.shell { display: grid; grid-template-columns: var(--rail) minmax(0, 1fr); min-height: 100dvh; }
.rail { position: sticky; top: 0; height: 100dvh; overflow-y: auto; scrollbar-width: thin; display: flex; flex-direction: column; padding: 16px 12px 12px; background: linear-gradient(180deg, var(--rail-bg) 0%, var(--rail-bg-2) 100%); color: var(--rail-ink); }
.brand { display: grid; gap: 6px; padding: 4px 6px 14px; text-decoration: none; }
.brand-card { display: block; padding: 8px 10px; border-radius: 10px; background: #fff; box-shadow: 0 6px 18px -10px rgb(0 0 0 / .6); }
.brand-card img { display: block; width: 100%; max-width: 168px; height: auto; margin: 0 auto; }
.brand-sub { padding-left: 2px; font-size: .6667rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--rail-ink-2); }
.nav { display: flex; flex-direction: column; gap: 1px; }
.nav a { position: relative; display: flex; align-items: center; gap: 10px; padding: 8px 10px 8px 12px; border-radius: 8px; text-decoration: none; color: var(--rail-ink); font-weight: 500; font-size: .9333rem; transition: background .15s, color .15s; }
.nav a:hover { background: rgb(255 255 255 / .06); color: #fff; }
.nav a[aria-current="page"] { background: var(--brand); color: #fff; font-weight: 600; box-shadow: 0 6px 16px -8px rgb(21 94 239 / .8); }
.nav a[aria-current="page"]::before { display: none; }
.nav svg { width: 18px; height: 18px; stroke-width: 1.9; color: var(--rail-ink-2); }
.nav a:hover svg, .nav a[aria-current="page"] svg { color: #fff; }
.nav .count { margin-left: auto; min-width: 20px; padding: 0 6px; border-radius: 10px; background: var(--lock); color: #fff; font-size: .7333rem; font-weight: 700; text-align: center; line-height: 20px; }
.nav-group { margin: 14px 12px 4px; font-size: .6667rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--rail-ink-2); }
.rail-foot { margin-top: auto; flex: none; display: flex; align-items: center; gap: 8px; padding: 12px 4px 0; border-top: 1px solid var(--rail-line); }
.rail-foot .who { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1; text-decoration: none; color: inherit; padding: 4px; border-radius: 8px; }
.rail-foot .who:hover { background: rgb(255 255 255 / .06); }
.avatar { display: grid; place-items: center; width: 34px; height: 34px; flex: none; border-radius: 50%; background: var(--c, #475467); color: #fff; font-size: .8rem; font-weight: 700; letter-spacing: .02em; }
.who-text { display: grid; min-width: 0; line-height: 1.2; }
.who-text b { font-size: .9333rem; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.who-text small { font-size: .7333rem; color: var(--rail-ink-2); }
.iconbtn { display: inline-grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 8px; background: transparent; color: var(--rail-ink-2); cursor: pointer; }
.iconbtn:hover { background: rgb(255 255 255 / .08); color: #fff; }
.iconbtn svg { width: 18px; height: 18px; }
main { min-width: 0; }
.topbar { position: sticky; top: 0; z-index: 15; display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 10px clamp(16px, 3vw, 36px); background: rgb(255 255 255 / .9); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.topbar .crumb { display: flex; align-items: center; gap: 4px; margin-right: auto; font-size: .8933rem; color: var(--ink-3); white-space: nowrap; }
.topbar .crumb a, .topbar .crumb span { text-decoration: none; font-weight: 500; color: var(--ink-3); }
.topbar .crumb svg { width: 14px; height: 14px; }
.topbar .crumb b { color: var(--ink); font-weight: 600; }
.topbar .gsearch { flex: 0 1 480px; margin: 0; }
.topbar .quick { flex: none; }
main.loading::before { content: ""; position: fixed; left: var(--rail); right: 0; top: 0; height: 2px; z-index: 60; background: linear-gradient(90deg, var(--brand) 0 60%, transparent); animation: load 1s linear infinite; }
@keyframes load { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.page { padding: 26px clamp(16px, 3vw, 36px) 90px; max-width: 1900px; }
.page-head { display: flex; flex-wrap: wrap; align-items: end; gap: 10px 12px; margin-bottom: 20px; }
.page-head > :first-child { margin-right: auto; min-width: 0; }
.page-head p { color: var(--ink-2); margin-top: 5px; max-width: 72ch; font-size: .9333rem; }
.back { display: inline-flex; align-items: center; gap: 4px; margin-bottom: 10px; color: var(--ink-3); text-decoration: none; font-weight: 500; font-size: .8667rem; }
.back:hover { color: var(--ink); }
.back svg { width: 15px; height: 15px; }
section + section, .block { margin-top: 26px; }
.people > section { margin-top: 0; }
.sec-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px; }
.sec-head .n { color: var(--ink-3); font-weight: 500; font-size: .8667rem; }
.sec-head .act { margin-left: auto; color: var(--brand-ink); font-weight: 600; font-size: .8667rem; text-decoration: none; }
.sec-head .act:hover { text-decoration: underline; }
.cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(290px, 360px); gap: 24px; align-items: start; }

/* ---------- KPI ---------- */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 22px; }
.stat { position: relative; display: grid; gap: 4px; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); text-decoration: none; transition: border-color .15s, box-shadow .2s, transform .2s var(--ease); overflow: hidden; }
.stat > span:first-child::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: var(--ink-4); vertical-align: 1px; }
a.stat:hover { border-color: var(--line-hover); box-shadow: var(--shadow-md); transform: translateY(-1px); }
.stat span { color: var(--ink-2); font-size: .8rem; font-weight: 600; letter-spacing: .01em; }
.stat b { font-size: 1.7333rem; font-weight: 700; letter-spacing: -.03em; line-height: 1.1; }
.stat b small { font-size: .8rem; font-weight: 600; color: var(--ink-3); letter-spacing: 0; margin-left: 2px; }
.stat > span + span, .stat b + span { font-weight: 500; color: var(--ink-3); }
.stat.alert { border-color: var(--lock-line); }
.stat.alert > span:first-child::before { background: var(--lock); }
.stat.alert b { color: var(--lock); }
.stat.ok > span:first-child::before { background: var(--ok); } .stat.wait > span:first-child::before { background: var(--wait); } .stat.info > span:first-child::before { background: var(--info); } .stat.brand > span:first-child::before { background: var(--brand); }

/* ---------- primeros pasos ---------- */
.start { padding: 22px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); }
.start > p { color: var(--ink-2); margin: 4px 0 16px; max-width: 64ch; }
.start ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; counter-reset: s; }
.start li { counter-increment: s; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; padding: 12px 14px; border: 1px solid var(--line-2); border-radius: var(--r); background: var(--subtle); }
.start li::before { content: counter(s); display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--brand-bg); color: var(--brand-ink); font-weight: 650; }
.start li.done::before { background: var(--ok-bg); color: var(--ok); }
.start li.done b { text-decoration: line-through; text-decoration-color: var(--ink-3); color: var(--ink-2); font-weight: 500; }
.start li span { grid-column: 2; color: var(--ink-2); font-size: .9333rem; }
.start li .btn { grid-column: 3; grid-row: 1 / 3; }

/* ---------- tarjeta de persona ---------- */
.tag { --c: #475467; --hx: 10px; --hr: 3.5px; position: relative; display: inline-flex; align-items: center; height: 24px; padding: 0 10px 0 19px; border-radius: 6px; background: var(--c); color: #fff; font-size: .8rem; font-weight: 600; letter-spacing: .005em; white-space: nowrap; max-width: 100%;
  -webkit-mask: radial-gradient(circle at var(--hx) 50%, transparent var(--hr), #000 calc(var(--hr) + .6px)); mask: radial-gradient(circle at var(--hx) 50%, transparent var(--hr), #000 calc(var(--hr) + .6px)); }
.tag.lg { --hx: 14px; --hr: 5px; height: 34px; padding: 0 15px 0 27px; font-size: 1rem; border-radius: 8px; }
.tag.none, .tag.ghost { -webkit-mask: none; mask: none; }
.tag.none::before, .tag.ghost::before { content: ""; position: absolute; left: calc(var(--hx) - var(--hr) - 1.5px); top: 50%; translate: 0 -50%; width: calc(var(--hr) * 2); height: calc(var(--hr) * 2); border-radius: 50%; }
.tag.none { background: var(--surface); color: var(--lock); border: 1.5px dashed var(--lock); }
.tag.none::before { border: 1.5px solid var(--lock); }
.tag.ghost { background: var(--surface); color: var(--ink-2); border: 1px solid var(--line); font-weight: 500; }
.tag.ghost::before { background: var(--c); }
.c0 { --c: #2451e6; } .c1 { --c: #12805c; } .c2 { --c: #c2410c; } .c3 { --c: #7c3aed; }
.c4 { --c: #0e7490; } .c5 { --c: #be185d; } .c6 { --c: #854d0e; } .c7 { --c: #475467; }
@keyframes hang { 0% { transform: translateY(-14px) rotate(-7deg); opacity: 0; } 55% { transform: translateY(1px) rotate(3deg); opacity: 1; } 100% { transform: none; } }
.tag.drop { transform-origin: var(--hx) 4px; animation: hang .2s var(--ease); }

/* ---------- banda "sin dueño" ---------- */
.unowned { border: 1px solid var(--lock-line); border-radius: var(--r-lg); background: var(--lock-bg); }
.unowned > header { display: flex; align-items: center; gap: 10px; padding: 14px 18px 4px; color: var(--lock); }
.unowned > header h2 { color: var(--lock); }
.unowned > header p { color: #9f1239; font-size: .9333rem; margin-left: auto; text-align: right; }
.hooks { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px 12px; padding: 20px 18px 18px; }
.hook { position: relative; display: grid; gap: 8px; padding: 24px 14px 14px; border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--lock-line); box-shadow: var(--shadow); align-content: start; }
.hook > .tag { position: absolute; top: -12px; left: 14px; }
.hook .t { font-weight: 600; line-height: 1.3; text-decoration: none; overflow-wrap: anywhere; }
.hook .t:hover { color: var(--brand-ink); }
.hook .meta { color: var(--ink-2); font-size: .8667rem; }
.hook .mention { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; font-size: .8667rem; color: var(--ink-2); }
.hook .btn { justify-self: start; margin-top: 2px; }
.all-owned { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border: 1px solid #abefc6; border-radius: var(--r-lg); color: var(--ok); font-weight: 500; background: var(--ok-bg); }

/* ---------- columnas por persona ---------- */
.people { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 26px 18px; align-items: start; }
.person > header { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; }
.person > header .load { margin-left: auto; color: var(--ink-3); font-size: .8667rem; text-align: right; }
.person .empty { padding: 18px; color: var(--ink-3); font-size: .9333rem; border: 1px dashed var(--line); border-radius: var(--r-lg); margin-top: -10px; }
.job { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; padding: 0 14px 12px; margin-bottom: 20px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); text-decoration: none; transition: border-color .15s, box-shadow .2s, transform .2s var(--ease); }
.job:hover { border-color: #c7cdd8; box-shadow: var(--shadow-lg); transform: translateY(-1px); }
.job > .tag { grid-column: 1 / -1; justify-self: start; margin: -12px 0 5px; }
.job .id { font-weight: 600; }
.job .what { grid-column: 1 / -1; color: var(--ink-2); font-size: .9333rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job .foot { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 5px; }

/* ---------- indicador de 6 pasos ---------- */
.gauge { display: inline-grid; grid-template-columns: repeat(6, 38px); gap: 3px; vertical-align: middle; }
.gauge i { display: grid; place-items: center; height: 22px; border-radius: 6px; font-style: normal; font-size: .7333rem; font-weight: 600; letter-spacing: .02em; color: var(--ink-3); background: var(--line-2); }
.gauge i.on { background: var(--ok); color: #fff; }
.gauge i.part { color: #0b5a2b; background: linear-gradient(135deg, #bbf7d0 50%, var(--line-2) 50%); }
.gauge i.now { background: var(--wait); color: #422a00; }
.gauge.lg { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; width: 100%; }
.gauge.lg i { height: auto; padding: 10px 4px; font-size: .8667rem; display: block; text-align: center; line-height: 1.25; border-radius: var(--r); }
.gauge.lg i small { display: block; font-weight: 500; font-size: .7333rem; opacity: .85; }

/* ---------- chips ---------- */
.chip { --dot: var(--ink-3); display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px 0 8px; border-radius: 6px; font-size: .7867rem; font-weight: 600; white-space: nowrap; color: var(--ink-2); background: var(--line-2); border: 1px solid transparent; }
.chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--dot); flex: none; }
.chip.late, .chip.bad { --dot: #d92d20; color: #b42318; background: #fef3f2; border-color: #fecdca; }
.chip.wait { --dot: #f59e0b; color: #7a4b00; background: #fffaeb; border-color: #fde9b0; }
.chip.ok { --dot: #16a34a; color: #067647; background: #ecfdf3; border-color: #abefc6; }
.chip.ink { --dot: var(--brand); color: var(--brand-ink); background: var(--brand-bg); border-color: var(--brand-100); }
.chip svg { width: 13px; height: 13px; stroke-width: 2.4; }

/* ---------- botones y campos ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px; padding: 0 14px; border-radius: var(--r); border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow); font-weight: 600; font-size: .9333rem; cursor: pointer; text-decoration: none; white-space: nowrap; transition: background .15s, border-color .15s, color .15s, transform .1s, box-shadow .15s; }
.btn:hover { background: var(--subtle); border-color: var(--line-hover); box-shadow: var(--shadow-md); }
.btn:active { transform: translateY(1px); }
.btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: 0 1px 2px rgb(43 58 133 / .35), inset 0 1px 0 rgb(255 255 255 / .12); }
.btn.primary:hover { background: var(--brand-ink); border-color: var(--brand-ink); }
.btn.take { background: var(--lock); border-color: var(--lock); color: #fff; }
.btn.take:hover { background: #b01825; border-color: #b01825; }
.btn.quiet { color: var(--ink-2); font-weight: 500; box-shadow: none; background: transparent; }
.btn.quiet:hover { color: var(--ink); background: var(--surface); }
.btn.danger { border-color: var(--lock-line); color: var(--lock); }
.btn.danger:hover { background: var(--lock-bg); border-color: var(--lock); }
.btn.sm { min-height: 30px; padding: 0 10px; font-size: .8667rem; border-radius: 6px; }
.btn[disabled] { opacity: .5; cursor: not-allowed; pointer-events: none; }
.btn svg { width: 17px; height: 17px; margin-left: -2px; }
.btn.sm svg { width: 15px; height: 15px; margin-left: -1px; }
.btn.primary svg, .btn.take svg { stroke-width: 2.4; }
label.f { display: grid; gap: 5px; font-size: .8rem; font-weight: 600; color: var(--ink-2); min-width: 0; }
input, select, textarea { width: 100%; min-height: 38px; padding: 7px 11px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); color: var(--ink); box-shadow: 0 1px 2px rgb(15 23 42 / .04); font-size: .9333rem; transition: border-color .15s, box-shadow .15s; }
select { appearance: none; -webkit-appearance: none; padding-right: 30px; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>"); background-repeat: no-repeat; background-position: right 9px center; }
input[type="checkbox"] { width: 18px; min-height: 18px; height: 18px; padding: 0; margin: 0; flex: none; box-shadow: none; }
textarea { min-height: 90px; resize: vertical; line-height: 1.5; }
input:hover, select:hover, textarea:hover { border-color: var(--line-hover); }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 3px rgb(43 58 133 / .2); }
::placeholder { color: #6b7686; opacity: 1; }
.form { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; align-items: end; }
.form .wide { grid-column: 1 / -1; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.form .actions { grid-column: 1 / -1; }
.check { display: flex; align-items: center; gap: 8px; font-weight: 500; min-height: 38px; }
.panel { padding: 18px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); }
details.panel > summary { cursor: pointer; font-weight: 600; list-style: none; display: flex; align-items: center; gap: 8px; }
details.panel > summary::-webkit-details-marker { display: none; }
details.panel > summary::before { content: ""; width: 7px; height: 7px; border-right: 2px solid var(--ink-3); border-bottom: 2px solid var(--ink-3); transform: rotate(-45deg); transition: transform .15s; }
details.panel[open] > summary::before { transform: rotate(45deg); }
details.panel[open] > summary { margin-bottom: 12px; }
.panel > h2, .panel > h3 { margin-bottom: 12px; }
.err { color: var(--lock); font-weight: 500; font-size: .9333rem; }
.toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; }
.toolbar input[type="search"] { flex: 1 1 220px; max-width: 360px; }
.toolbar select { width: auto; }
.toolbar.filters { padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); }
.toolbar.filters label.f { display: flex; align-items: center; gap: 6px; }
.seg { display: flex; flex-wrap: wrap; gap: 2px; padding: 3px; border-radius: 10px; background: #e6eaf1; max-width: 100%; }
.seg button, .seg .btn { min-height: 32px; padding: 0 12px; border: 0; border-radius: 7px; background: transparent; box-shadow: none; font-weight: 500; font-size: .8933rem; color: var(--ink-2); cursor: pointer; transition: background .15s, color .15s; text-decoration: none; }
.seg button:hover, .seg .btn:hover { color: var(--ink); background: rgb(255 255 255 / .55); }
.seg button[aria-pressed="true"], .seg .btn.primary { background: var(--surface); color: var(--ink); font-weight: 600; box-shadow: var(--shadow); border: 0; }
.seg button .n, .seg .btn .n { display: inline-block; min-width: 18px; margin-left: 6px; padding: 0 5px; border-radius: 9px; background: rgb(15 23 42 / .07); color: var(--ink-2); font-size: .7333rem; font-weight: 600; line-height: 18px; text-align: center; }
.seg .btn.primary .n, .seg button[aria-pressed="true"] .n { background: var(--brand-bg); color: var(--brand-ink); }

/* ---------- listas ---------- */
.list { border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); overflow: hidden; }
.row { display: grid; gap: 4px 14px; align-items: center; padding: 11px 16px; border-bottom: 1px solid var(--line-2); text-decoration: none; transition: background .12s; }
a.row { position: relative; }
.list > :last-child { border-bottom: 0; }
a.row:hover { background: var(--subtle); }
.row .main { min-width: 0; }
.row .main > b { display: block; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.row .main > span { display: block; color: var(--ink-2); font-size: .8933rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.row .main > span .chip { vertical-align: middle; margin-right: 2px; }
.row.q { grid-template-columns: 116px minmax(0, 1fr) 110px 128px 150px; }
.row.o { grid-template-columns: 112px minmax(0, 1fr) 104px 246px 124px 156px; }
.row.c { grid-template-columns: minmax(0, 1fr) 120px 120px 120px; }
.row.head { padding: 8px 16px; font-size: .7333rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); background: var(--subtle); border-bottom: 1px solid var(--line); }
.empty-state { padding: 44px 20px; text-align: center; color: var(--ink-2); font-size: .9333rem; max-width: 46ch; margin: 0 auto; }
.empty-state::before { content: ""; display: block; width: 48px; height: 48px; margin: 0 auto 14px; border-radius: 14px; background: var(--brand-bg) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%232b3a85' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='22 12 16 12 14 15 10 15 8 12 2 12'/><path d='M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z'/></svg>") center / 22px no-repeat; }
.empty-state b { display: block; color: var(--ink); margin-bottom: 4px; font-size: 1rem; font-weight: 650; }
.empty-state .btn { margin-top: 14px; }
.list > .empty-state, .list > p.empty-state { max-width: none; }
.list > .empty-state::before { display: block; }

/* ---------- detalle ---------- */
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px 18px; margin: 0; padding: 18px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); }
.facts dt { font-size: .7333rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); }
.facts dd { margin: 2px 0 0; font-weight: 600; overflow-wrap: anywhere; }
.owner-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); margin-bottom: 18px; }
.owner-bar.unset { border-color: var(--lock-line); background: var(--lock-bg); }
.owner-bar .grow { margin-right: auto; }
.owner-bar select { width: auto; min-width: 150px; }
.steps { display: flex; flex-wrap: wrap; gap: 6px; }
.items { width: 100%; border-collapse: collapse; }
.items th { position: sticky; top: 0; z-index: 1; text-align: left; padding: 9px 8px; font-size: .7333rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); background: var(--surface); border-bottom: 1px solid var(--line); white-space: nowrap; }
.items td { padding: 9px 8px; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
.items tbody tr:hover td { background: var(--subtle); }
.items td input { min-height: 34px; padding: 5px 9px; }
.items th.num, .items td.num { text-align: right; }
.items tr.sel td { background: var(--brand-bg); }
.items tfoot td { font-weight: 600; border-bottom: 0; padding-top: 12px; }
.items .desc { min-width: 200px; }
.items td input[type="number"] { width: 104px; }
.scroll-x { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sheet { padding: 6px 12px 12px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); }
.bulk { position: sticky; bottom: 14px; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; padding: 10px 12px; border-radius: var(--r-lg); background: var(--ink); color: #fff; box-shadow: var(--shadow-lg); }
.bulk b { margin: 0 4px; font-weight: 600; }
.bulk select, .bulk input { width: auto; min-width: 150px; border-color: transparent; }
.bulk .btn { background: var(--brand); border-color: var(--brand); color: #fff; }
.bulk .btn:hover { background: var(--brand-ink); }
.mail { border-bottom: 1px solid var(--line-2); }
.mail summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; padding: 12px 16px; cursor: pointer; list-style: none; }
.mail summary::-webkit-details-marker { display: none; }
.mail summary:hover { background: var(--subtle); }
.mail summary b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mail summary .sub { grid-column: 1 / -1; color: var(--ink-2); font-size: .9333rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mail .body { padding: 0 16px 16px; }
.mail pre { margin: 10px 0 0; padding: 14px; max-height: 360px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: .9333rem; background: var(--subtle); border: 1px solid var(--line-2); border-radius: var(--r); max-width: 80ch; }
.files { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.log { display: grid; gap: 0; }
.log li { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line-2); font-size: .9333rem; }
.log li time { color: var(--ink-3); font-size: .8667rem; }
.log li.note p { margin-top: 3px; padding: 9px 11px; background: var(--wait-bg); border: 1px solid #fde9b0; border-radius: var(--r); white-space: pre-wrap; overflow-wrap: anywhere; }
ul { list-style: none; margin: 0; padding: 0; }
.note-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; margin-bottom: 10px; align-items: start; }
.note-form textarea { min-height: 64px; height: 64px; }
.task { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 4px 10px; align-items: start; padding: 12px 16px; border-bottom: 1px solid var(--line-2); }
.task input { margin-top: 3px; }
.task .t { font-weight: 500; overflow-wrap: anywhere; }
.task.done .t { text-decoration: line-through; color: var(--ink-3); font-weight: 400; }
.task .meta { grid-column: 2 / -1; display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; font-size: .8667rem; color: var(--ink-2); }
.task .btn { box-shadow: none; border-color: transparent; background: transparent; }
.group-title { margin: 26px 0 10px; display: flex; gap: 8px; align-items: baseline; }
.group-title.late { color: var(--lock); }
.sales { width: 100%; border-collapse: collapse; }
.sales th, .sales td { padding: 11px 16px; border-bottom: 1px solid var(--line-2); text-align: right; }
.sales th { font-size: .7333rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); background: var(--subtle); border-bottom: 1px solid var(--line); }
.sales tbody tr:hover td { background: var(--subtle); }
.sales tr:last-child td { border-bottom: 0; }
.sales th:first-child, .sales td:first-child { text-align: left; }
code.k { display: block; margin-top: 6px; padding: 10px 12px; background: var(--subtle); border: 1px solid var(--line); border-radius: var(--r); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8667rem; overflow-wrap: anywhere; user-select: all; }
ol.how { margin: 0; padding-left: 20px; display: grid; gap: 8px; max-width: 72ch; }

.m-only, .nav a.m-only { display: none; }
.items tr.buy td { padding-top: 0; }
.items tbody[data-row] tr:first-child td { border-bottom: 0; padding-bottom: 4px; }
.buy-grid { display: grid; grid-template-columns: auto minmax(90px, .8fr) minmax(100px, 1fr) 110px minmax(160px, 2fr); gap: 6px; align-items: center; }
.buy-grid.x5 { grid-template-columns: 1.4fr .9fr 1fr .9fr 1.5fr; }
.buy-grid.x5 input { min-width: 0; }
.costpair { display: grid; grid-template-columns: 1fr 62px; gap: 4px; min-width: 0; }
.costpair [data-markup].low { border-color: var(--lock); color: var(--lock); background: var(--lock-bg); }
.items td.desc textarea { min-height: 54px; height: 54px; padding: 6px 9px; }
.buy-grid input { min-height: 32px; padding: 4px 9px; font-size: .9333rem; background: var(--subtle); }
.items td .buy-grid input[type="number"] { width: 100%; }
.big-search { min-height: 46px; font-size: 1.0667rem; max-width: 640px !important; flex-basis: 100% !important; padding-left: 14px; }
.product { border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); margin-bottom: 16px; overflow: hidden; }
.product > header { display: flex; flex-wrap: wrap; gap: 12px 24px; justify-content: space-between; align-items: start; padding: 16px 18px; border-bottom: 1px solid var(--line-2); }
.product > header > div:first-child { min-width: 0; flex: 1 1 320px; }
.product h2 { overflow-wrap: anywhere; }
.product .lastbuy { display: grid; gap: 2px; justify-items: start; padding: 10px 14px; border-radius: var(--r); background: var(--brand-bg); min-width: 200px; }
.product .lastbuy b { font-size: 1.2rem; font-weight: 650; letter-spacing: -.01em; }
.product .lastbuy .btn { margin-top: 6px; }
.product .items { margin: 0 10px 8px; width: calc(100% - 20px); }
.product .items tr:last-child td { border-bottom: 0; }
td .btn.sm { vertical-align: middle; }

.nav-group { margin: 10px 10px 2px; font-size: .7333rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); }
.gsearch { position: relative; margin: 0; }
.gsearch input { background: var(--bg); box-shadow: none; padding-left: 36px; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='8'/><path d='m21 21-4.3-4.3'/></svg>"); background-repeat: no-repeat; background-position: 11px center; }
.gsearch input:focus-visible { background-color: var(--surface); }
.gresults { position: absolute; left: 0; top: calc(100% + 6px); z-index: 30; width: min(420px, calc(100vw - 32px)); max-height: 60vh; overflow: auto; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow-lg); }
.gresults a { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 0 10px; padding: 9px 12px; text-decoration: none; border-bottom: 1px solid var(--line-2); }
.gresults a:hover, .gresults a:focus-visible { background: var(--brand-bg); }
.gresults a .kind2 { grid-row: 1 / 3; align-self: center; font-size: .7333rem; font-weight: 600; color: var(--brand-ink); }
.gresults a b, .gresults a .small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.banner { display: flex; gap: 10px; align-items: start; padding: 12px 16px; margin-bottom: 14px; border: 1px solid #fde9b0; border-radius: var(--r-lg); background: var(--wait-bg); color: var(--wait-ink); }
.banner.bad { border-color: var(--lock-line); background: var(--lock-bg); color: #9f1239; }
.facts .wide { grid-column: 1 / -1; }
.gauge.g5 { grid-template-columns: repeat(5, 36px); }
.opbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 12px; }
.opform { margin-top: 12px; border-color: var(--brand); box-shadow: 0 0 0 3px rgb(43 58 133 / .14); }
.rec { padding: 14px 16px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); }
.rec > header { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; }
.rec .right { margin-left: auto; font-weight: 600; }
.rec > footer { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; }
.rec > footer .btn:last-child { margin-left: auto; }
.rec-lines { margin: 8px 0; border-top: 1px solid var(--line-2); }
.rec-lines li { display: flex; gap: 12px; justify-content: space-between; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--line-2); font-size: .9333rem; }
.rec-lines li > span:first-child { min-width: 0; overflow-wrap: anywhere; }
form.inline { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 10px; }
form.inline input, form.inline select { width: auto; flex: 1 1 130px; min-height: 32px; padding: 4px 9px; font-size: .9333rem; }
form.inline .check { min-height: 32px; flex: 0 1 auto; }
form.inline .check input { flex: none; }
.upload { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.upload select { width: auto; }
.upload input[type="file"] { flex: 1 1 220px; width: auto; padding: 6px; font-size: .8667rem; }
.upload.slim input[type="file"] { min-height: 32px; border-style: dashed; box-shadow: none; }
.picks { border: 1px solid var(--line); border-radius: var(--r); padding: 8px 12px; margin: 0; display: grid; gap: 2px; }
.picks legend { padding: 0 6px; font-size: .8667rem; font-weight: 500; color: var(--ink-2); }
.picks .check { min-height: 32px; font-weight: 400; }
.offers > summary { cursor: pointer; list-style: none; }
.offers > summary::-webkit-details-marker { display: none; }
.offers[open] > summary { margin-bottom: 10px; }
.todo { display: grid; gap: 6px; }
.todo li { position: relative; padding-left: 18px; font-size: .9333rem; }
.todo li::before { content: ""; position: absolute; left: 2px; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--wait); }
.stock-forms { max-width: 760px; }
.aibox { border-color: var(--brand); margin-bottom: 10px; }
.payrow { margin-bottom: 4px; }
.payrow > p { margin: 0 0 4px 2px; }
.row.rp { grid-template-columns: minmax(0, 1fr) repeat(4, 130px) 80px; }
.items tr.total td { border-top: 2px solid var(--ink); border-bottom: 0; }
.toolbar label.f { flex: 0 0 auto; }
.row.st { grid-template-columns: minmax(0, 1fr) 150px 100px 100px 100px 100px; }
.row.mv { grid-template-columns: 80px minmax(0, 1fr) 140px 110px 90px; }
.row.k { grid-template-columns: 90px minmax(0, 1fr) 170px 190px 130px; }
.row.cf { grid-template-columns: 90px minmax(0, 1fr) 100px 150px 150px; }
.row.p { grid-template-columns: 120px minmax(0, 1fr) 190px 130px 100px 150px; }
.row.v { grid-template-columns: 120px minmax(0, 1fr) 210px 130px 150px; }
.user-ctl { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.user-ctl select { width: auto; min-height: 32px; padding: 4px 8px; }

/* ---------- documento de cotización (sigue el formato que HT ya usa) ---------- */
.docbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; max-width: 900px; margin: 0 auto 14px; }
.docbar > :first-child { margin-right: auto; }
.doc { --k: #111; max-width: 900px; margin: 0 auto; padding: 36px 40px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); color: var(--k); font-size: .8rem; line-height: 1.4; }
.doc header { display: flex; justify-content: space-between; align-items: start; gap: 24px; margin-bottom: 14px; }
.doc header > img { width: 270px; height: auto; }
.doc header .id { text-align: right; }
.doc header .id h1 { font-size: 1.6rem; letter-spacing: 0; margin-bottom: 14px; }
.doc table { border-collapse: collapse; }
.doc .box, .doc table.box td, .doc table.box th { border: 1.5px solid var(--k); }
.doc table.box th { padding: 3px 6px; font-weight: 700; text-align: center; background: #fff; white-space: nowrap; }
.doc table.box td { padding: 4px 8px; text-align: center; }
.doc header .id table { margin-left: auto; min-width: 260px; }
.doc .parties { display: grid; grid-template-columns: 1fr 1.2fr; gap: 56px; margin-bottom: 20px; }
.doc .parties h2 { font-size: .8667rem; font-weight: 700; padding: 3px 6px; border-bottom: 1.5px solid var(--k); }
.doc .parties p { padding: 6px; line-height: 1.6; overflow-wrap: anywhere; min-height: 100px; }
.doc .strip { width: 100%; margin-bottom: 20px; table-layout: fixed; }
.doc .strip th { font-size: .7333rem; padding: 3px 2px; }
.doc .strip td { padding: 8px 6px; overflow-wrap: anywhere; }
.doc .strip th:nth-child(5), .doc .strip td:nth-child(5), .doc .strip th:nth-child(6), .doc .strip td:nth-child(6) { width: 20%; }
.doc .lines { width: 100%; }
.doc .lines td { height: 22px; vertical-align: middle; }
.doc .lines th { font-size: .7333rem; }
.doc .lines td.desc { text-align: center; white-space: pre-wrap; overflow-wrap: anywhere; min-width: 180px; }
.doc .lines td.r, .doc .sum td { text-align: right; white-space: nowrap; }
.doc .lines td.img { width: 120px; padding: 4px; }
.doc .lines td.img img { display: block; max-width: 110px; max-height: 80px; margin: 0 auto; object-fit: contain; }
.doc .lines tr { break-inside: avoid; }
.doc .totals { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 24px; align-items: start; }
.doc .terms h2 { font-size: .9333rem; font-weight: 500; text-decoration: underline; margin: 4px 0; }
.doc .terms p { margin: 3px 0; }
.doc .terms .strong { font-size: .9333rem; font-weight: 700; margin-top: 8px; }
.doc .sum { width: 100%; margin-top: -1.5px; }
.doc .sum th { text-align: left !important; font-size: .7333rem; }
.doc .sum .grand th { background: #ffeb3b !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.doc .sign { break-inside: avoid; margin-top: 22px; text-align: center; font-size: .9333rem; }
.doc .sign .name { margin-top: 26px; padding-top: 6px; border-top: 1.5px solid var(--k); }
.doc footer { break-inside: avoid; margin-top: 18px; color: var(--k); font-size: .7333rem; text-align: center; line-height: 1.7; }
.imgpick { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 6px; }
.imgpick img { width: 46px; height: 46px; object-fit: contain; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.row.user-row { display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; }
.user-row .main { flex: 1 1 240px; }

.bell { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin: 0; flex: none; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); cursor: pointer; color: var(--ink-2); }
.bell:hover { color: var(--ink); background: var(--subtle); }
.bell .count { position: absolute; top: -6px; right: -6px; margin: 0; min-width: 18px; padding: 0 5px; border-radius: 11px; background: var(--lock); color: #fff; font-size: .7333rem; font-weight: 600; text-align: center; }
.bellbox { position: fixed; z-index: 40; width: 390px; max-height: 70vh; overflow: auto; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow-lg); }
.bellhead { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--line-2); }
.bellbox a { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; padding: 10px 14px; text-decoration: none; border-bottom: 1px solid var(--line-2); align-items: start; }
.bellbox a:hover { background: var(--subtle); }
.bellbox a.read { opacity: .6; }
.bellbox a small { display: block; color: var(--ink-3); margin-top: 2px; }


/* ---------- acceso ---------- */
.gate { min-height: 100dvh; display: grid; place-items: center; padding: 24px 16px; background: radial-gradient(1200px 600px at 50% -10%, var(--brand-bg), transparent 60%), var(--bg); }
.gate form { width: min(100%, 420px); display: grid; gap: 14px; padding: 30px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow-lg); }
.gate .mark { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.gate .mark { display: grid; gap: 14px; }
.gate .mark img { width: 220px; height: auto; }
.gate h1 { font-size: 1.3333rem; }
.gate p { color: var(--ink-2); }

#toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px); padding: 11px 18px; border-radius: 10px; background: var(--ink); color: #fff; font-weight: 500; opacity: 0; pointer-events: none; transition: opacity .2s, transform .25s var(--ease); z-index: 50; max-width: calc(100vw - 32px); box-shadow: var(--shadow-lg); }
#toast.show { opacity: 1; transform: translate(-50%, 0); }
#toast.bad { background: var(--lock); }

/* ---------- celular ---------- */
@media (max-width: 860px) {
  .shell { display: block; }
  .rail { position: fixed; inset: auto 0 0 0; z-index: 20; height: auto; flex-direction: row; padding: 4px 4px calc(4px + env(safe-area-inset-bottom)); border-right: 0; background: var(--rail-bg); box-shadow: 0 -8px 24px -12px rgb(0 0 0 / .5); }
  .brand, .rail-foot, .nav a.m-hide, .nav-group, .d-only { display: none !important; }
  .row.p, .row.v, .stock-forms { max-width: 760px; }
.aibox { border-color: var(--brand); margin-bottom: 10px; }
.payrow { margin-bottom: 4px; }
.payrow > p { margin: 0 0 4px 2px; }
.row.rp { grid-template-columns: minmax(0, 1fr) repeat(4, 130px) 80px; }
.items tr.total td { border-top: 2px solid var(--ink); border-bottom: 0; }
.toolbar label.f { flex: 0 0 auto; }
.row.st { grid-template-columns: minmax(0, 1fr) 150px 100px 100px 100px 100px; }
.row.mv { grid-template-columns: 80px minmax(0, 1fr) 140px 110px 90px; }
.row.k { grid-template-columns: minmax(0, 1fr) auto; }
  .row.p .main, .row.v .main, .row.k .main { grid-column: 1 / -1; order: -1; }
  .topbar { min-height: 56px; padding: 8px 12px; gap: 8px; }
  .topbar .gsearch { flex: 1 1 auto; }
  main.loading::before { left: 0; }
  .m-only, .nav a.m-only { display: flex; }
  .bellbox { left: 16px !important; right: 16px; top: 70px !important; width: auto; }
  .buy-grid { grid-template-columns: 1fr 1fr; }
  .buy-grid > span, .buy-grid input[name="source_url"] { grid-column: 1 / -1; }
  .nav { flex-direction: row; flex: 1; gap: 0; }
  .nav a { flex: 1; flex-direction: column; gap: 3px; padding: 6px 2px; min-height: 54px; font-size: .7333rem; justify-content: center; position: relative; border-radius: 8px; }
  .nav a[aria-current="page"]::before { display: none; }
  .nav svg { width: 20px; height: 20px; }
  .nav .count { position: absolute; top: 3px; left: calc(50% + 6px); margin: 0; min-width: 18px; padding: 0 4px; font-size: .7333rem; }
  .page { padding: 16px 14px calc(96px + env(safe-area-inset-bottom)); }
  h1 { font-size: 1.4667rem; }
  .cols { grid-template-columns: minmax(0, 1fr); }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .stat { padding: 12px 12px 12px 14px; }
  .stat b { font-size: 1.4rem; }
  .btn { min-height: 44px; }
  .btn.sm { min-height: 38px; }
  input, select, textarea { min-height: 44px; font-size: 16px; }
  .seg { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; scrollbar-width: none; }
  .seg button { min-height: 38px; flex: none; }
  .row.head { display: none; }
  .row.q, .row.o, .row.c { grid-template-columns: minmax(0, 1fr) auto; }
  .row.q > :nth-child(1), .row.o > :nth-child(1) { font-size: .8667rem; color: var(--ink-2); }
  .row.q .main, .row.o .main, .row.c .main { grid-column: 1 / -1; order: -1; }
  .row .num { text-align: left; }
  .unowned > header p { display: none; }
  .hooks { grid-template-columns: minmax(0, 1fr); padding: 20px 12px 12px; }
  .start li { grid-template-columns: 30px minmax(0, 1fr); }
  .start li .btn { grid-column: 2; grid-row: auto; justify-self: start; margin-top: 6px; }
  .gauge.lg { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bulk { position: static; }
  .items.po thead th:not(:first-child) { display: none; }
  .items.po thead th:first-child { display: flex; align-items: center; gap: 8px; }
  .items.po thead th:first-child::after { content: "Seleccionar todas"; }
  .items.po, .items.po thead, .items.po tbody, .items.po thead tr { display: block; }
  .items.po tr[data-item] { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 3px 8px; padding: 12px 4px; border-bottom: 1px solid var(--line-2); }
  .items.po tr[data-item] td { padding: 0; border: 0; background: none; text-align: left; }
  .items.po tr[data-item].sel { background: var(--brand-bg); }
  .items.po tr[data-item] td:nth-child(1) { grid-row: 1 / 6; }
  .items.po tr[data-item] td:nth-child(2) { grid-column: 2; font-size: .8667rem; color: var(--ink-2); }
  .items.po tr[data-item] td:nth-child(2)::before { content: "Partida "; }
  .items.po tr[data-item] td:nth-child(5) { grid-column: 3; grid-row: 1; font-weight: 600; }
  .items.po tr[data-item] td:nth-child(3) { grid-column: 2 / -1; min-width: 0; }
  .items.po tr[data-item] td:nth-child(4) { grid-column: 2 / -1; font-size: .8667rem; color: var(--ink-2); }
  .items.po tr[data-item] td:nth-child(4)::before { content: "Cantidad "; }
  .items.po tr[data-item] td:nth-child(6) { grid-column: 2 / -1; font-size: .9333rem; }
  .items.po tr[data-item] td:nth-child(7) { grid-column: 2; margin-top: 4px; }
  .items.po tr[data-item] td:nth-child(8) { grid-column: 3; margin-top: 4px; }
  .items.po tr.sel:not([data-item]), .items.po tr.sel:not([data-item]) td { display: block; }
  .log li { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  #toast { bottom: calc(84px + env(safe-area-inset-bottom)); }
}
@media screen and (max-width: 860px) { .doc { padding: 16px 12px; overflow-x: auto; } .doc > * { min-width: 720px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
@media print { @page { margin: 14mm; } .rail, .bulk, .btn, .toolbar, .docbar, .topbar, #toast, .gsearch { display: none !important; } .shell { display: block; } body, :root { background: #fff; } main, .page { padding: 0; max-width: none; } .doc { border: 0; box-shadow: none; padding: 0 3px; max-width: none; } }

/* Línea de la operación (expediente del pedido): un paso por etapa, de la solicitud al cobro. */
.optl { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.optl li { position: relative; padding: 10px 26px 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow); font-size: .8rem; display: grid; gap: 3px; }
.optl li b { font-size: .6667rem; color: var(--ink-3); text-transform: uppercase; letter-spacing: .07em; font-weight: 700; }
.optl li span:last-child { font-weight: 500; color: var(--ink); }
.optl li .dot { position: absolute; right: 10px; top: 11px; width: 9px; height: 9px; border-radius: 50%; background: var(--ink-4); }
.optl li.ok .dot { background: var(--ok); } .optl li.wait .dot { background: var(--wait); }
.optl li.ok { border-color: color-mix(in srgb, var(--ok) 40%, var(--line)); }

/* ---------- tablero: accesos rápidos y bloques ---------- */
.quick-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-bottom: 22px; }
.quick-grid a { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); text-decoration: none; font-weight: 600; font-size: .8933rem; color: var(--ink); transition: border-color .15s, box-shadow .2s, transform .2s var(--ease); }
.quick-grid a:hover { border-color: var(--line-hover); box-shadow: var(--shadow-md); transform: translateY(-1px); }
.quick-grid a svg { width: 18px; height: 18px; color: var(--brand); flex: none; }
.quick-grid a .k { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: var(--brand-bg); flex: none; }
.kpi-grid { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }

.kpi-grid.x7 { grid-template-columns: repeat(auto-fit, minmax(136px, 1fr)); }
.kpi-grid.x9 { grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)); }
.kpi-grid.x9 .stat { padding: 12px 12px 12px 15px; }
.kpi-grid.x9 .stat b { font-size: 1.4667rem; }
.kpi-grid.x9 .stat span { font-size: .7333rem; }
.seg.tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.seg.tabs::-webkit-scrollbar { display: none; }
.seg.tabs .btn { flex: none; }
.brand-card img { max-width: 168px; }
.nav a { padding: 7px 10px 7px 12px; }
.nav-group { margin: 12px 12px 3px; }
.m-only.btn { display: none; }
@media (max-width: 860px) { .m-only.btn { display: inline-flex; } .kpi-grid.x7, .kpi-grid.x9 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) {
  .toolbar.filters > select, .toolbar.filters > input, .toolbar.filters > label.f { flex: 1 1 100%; width: 100%; }
  .toolbar.filters > label.f input { flex: 1; }
  .toolbar.filters .btn { flex: 1 1 auto; }
  .row .main > span { white-space: normal; }
  .page-head .btn.primary { width: 100%; }
}

/* ---------- kit: encabezado con icono, KPI con icono, progreso, panel derecho, actividad, diálogos ---------- */
.ph-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--brand-bg); color: var(--brand); flex: none; align-self: start; margin-right: 2px; }
.ph-icon svg { width: 22px; height: 22px; }
.page-head > .ph-icon + div { margin-right: auto; }
.page-head > :first-child:not(.ph-icon) { margin-right: auto; }
.topbar .user { display: flex; align-items: center; gap: 8px; padding: 4px 6px 4px 4px; border-radius: 10px; text-decoration: none; color: inherit; }
.topbar .user:hover { background: var(--subtle); }
.topbar .user .avatar { width: 32px; height: 32px; font-size: .7333rem; }
.topbar .user b { display: block; font-size: .8667rem; line-height: 1.15; }
.topbar .user small { display: block; font-size: .7333rem; color: var(--ink-3); line-height: 1.15; }
.topbar .help { display: inline-grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); color: var(--ink-2); text-decoration: none; flex: none; }
.topbar .help:hover { color: var(--ink); background: var(--subtle); }
.topbar .help svg { width: 18px; height: 18px; }
.kbd { font: 600 .6667rem/1 ui-monospace, SFMono-Regular, Menlo, monospace; padding: 3px 5px; border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 5px; color: var(--ink-3); background: var(--surface); }
.gsearch .kbd { position: absolute; right: 9px; top: 50%; translate: 0 -50%; pointer-events: none; }
.kpi-grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin-bottom: 20px; }
.kpi { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); text-decoration: none; color: inherit; min-width: 0; transition: border-color .15s, box-shadow .2s, transform .2s var(--ease); }
a.kpi:hover { border-color: var(--line-hover); box-shadow: var(--shadow-md); transform: translateY(-1px); }
.kpi-ic { display: grid; place-items: center; width: 46px; height: 46px; flex: none; border-radius: 50%; background: var(--brand-bg); color: var(--brand); }
.kpi-ic svg { width: 22px; height: 22px; }
.kpi.ok .kpi-ic { background: var(--ok-bg); color: var(--ok); } .kpi.wait .kpi-ic { background: var(--wait-bg); color: #b45309; } .kpi.alert .kpi-ic { background: var(--lock-bg); color: var(--lock); } .kpi.info .kpi-ic { background: var(--info-bg); color: var(--info); } .kpi.violet .kpi-ic { background: var(--violet-bg); color: var(--violet); }
.kpi-body { display: grid; min-width: 0; line-height: 1.15; }
.kpi-body b { font-size: 1.7333rem; font-weight: 700; letter-spacing: -.03em; }
.kpi-body b small { font-size: .8rem; font-weight: 600; color: var(--ink-3); letter-spacing: 0; margin-left: 3px; }
.kpi-label { font-weight: 600; font-size: .8933rem; color: var(--ink); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi-sub { font-size: .7867rem; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi.alert .kpi-body b { color: var(--lock); }
.prog { display: inline-flex; align-items: center; gap: 8px; min-width: 120px; }
.prog > i { position: relative; flex: 1; height: 6px; border-radius: 3px; background: var(--line-2); overflow: hidden; display: block; width: auto !important; }
.prog > i::after { content: ""; position: absolute; inset: 0; width: var(--w, 0%); border-radius: 3px; background: var(--ink-4); }
.prog small { font-size: .7867rem; font-weight: 600; color: var(--ink-2); min-width: 34px; text-align: right; }
.prog.ok i::after { background: var(--ok); } .prog.ink i::after { background: var(--brand); } .prog.bad i::after { background: var(--lock); } .prog.wait i::after { background: var(--wait); }
.avatar.sm { width: 26px; height: 26px; font-size: .6667rem; }
.cell-user { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.dt { width: 100%; border-collapse: separate; border-spacing: 0; }
.dt th { position: sticky; top: 0; z-index: 1; text-align: left; padding: 10px 12px; font-size: .7333rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); background: var(--subtle); border-bottom: 1px solid var(--line); white-space: nowrap; }
.dt td { padding: 11px 12px; border-bottom: 1px solid var(--line-2); vertical-align: middle; font-size: .9333rem; }
.dt tbody tr:hover td { background: var(--subtle); }
.dt tr:last-child td { border-bottom: 0; }
.dt td.num, .dt th.num { text-align: right; }
.dt td .small { display: block; color: var(--ink-3); }
.dt a.folio { font-weight: 600; color: var(--brand); text-decoration: none; }
.dt a.folio:hover { text-decoration: underline; }
.dt .btn.sm { min-height: 28px; padding: 0 8px; }
.table-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--line-2); }
.table-head h2 { margin-right: auto; }
.table-head h2 .n { color: var(--brand); font-weight: 600; margin-left: 6px; }
.side { display: grid; gap: 16px; align-content: start; }
.side .panel { padding: 14px 16px; }
.side .panel h2 { display: flex; align-items: center; gap: 8px; font-size: .9333rem; margin-bottom: 10px; }
.side .panel h2 .act { margin-left: auto; font-size: .8rem; color: var(--brand); font-weight: 600; text-decoration: none; }
.mini-list { display: grid; }
.mini-list > * { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line-2); text-decoration: none; color: inherit; font-size: .8933rem; min-width: 0; }
.mini-list > :last-child { border-bottom: 0; }
.mini-list .grow { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-list .grow small { display: block; color: var(--ink-3); font-size: .7867rem; }
.mini-list .ic { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--brand-bg); color: var(--brand); flex: none; }
.mini-list .ic svg { width: 15px; height: 15px; }
.legend { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .7867rem; color: var(--ink-2); margin-top: 8px; }
.legend i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 5px; background: var(--ink-4); }
.legend i.ink { background: var(--brand); } .legend i.ok { background: var(--ok); } .legend i.wait { background: var(--wait); } .legend i.bad { background: var(--lock); }
.banner-brand { position: relative; overflow: hidden; display: grid; gap: 4px; padding: 18px; border-radius: var(--r-lg); color: #fff; background: linear-gradient(120deg, #0b1f3a, #163a7a 70%, #155eef); }
.banner-brand b { font-size: 1.0667rem; letter-spacing: -.01em; }
.banner-brand span { font-size: .8667rem; color: #c6d2e6; }
.activity { margin-top: 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 12px 16px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); }
.act-head { display: flex; align-items: center; gap: 8px; font-size: .9333rem; }
.act-head svg { width: 18px; height: 18px; color: var(--brand); }
.act-items { display: flex; flex-wrap: wrap; gap: 8px; flex: 1; min-width: 0; }
.act-item { display: flex; align-items: center; gap: 8px; padding: 7px 12px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--subtle); text-decoration: none; color: inherit; font-size: .8267rem; min-width: 0; }
.act-item .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ink-4); flex: none; }
.act-item .dot.ok { background: var(--ok); } .act-item .dot.ink { background: var(--brand); } .act-item .dot.wait { background: var(--wait); } .act-item .dot.bad { background: var(--lock); }
.act-item b { display: block; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 320px; }
.act-item small { color: var(--ink-3); }
.act-all { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-size: .8667rem; font-weight: 600; color: var(--brand); text-decoration: none; }
.act-all svg { width: 14px; height: 14px; }
.dlg-back { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 16px; background: rgb(11 31 58 / .45); backdrop-filter: blur(2px); animation: fade .15s; }
.dlg { width: min(100%, 440px); display: grid; gap: 12px; padding: 22px; border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-lg); animation: pop .18s var(--ease); }
.dlg h3 { font-size: 1.0667rem; }
.dlg p { color: var(--ink-2); font-size: .9333rem; }
.dlg .actions { justify-content: flex-end; margin-top: 4px; }
@keyframes fade { from { opacity: 0; } } @keyframes pop { from { opacity: 0; transform: translateY(8px) scale(.98); } }
.empty-state.k-filtered::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%232b3a85' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polygon points='22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3'/></svg>"); }
.empty-state.k-locked::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%232b3a85' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect width='18' height='11' x='3' y='11' rx='2'/><path d='M7 11V7a5 5 0 0 1 10 0v4'/></svg>"); }
.empty-state.k-error::before { background: var(--lock-bg) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23d0202f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><path d='M12 8v4'/><path d='M12 16h.01'/></svg>") center / 22px no-repeat; }
.empty-state.k-loading::before { background: var(--line-2); animation: pulse 1.2s ease-in-out infinite; }
@keyframes pulse { 50% { opacity: .4; } }
.skeleton { display: grid; gap: 10px; }
.skeleton i { display: block; height: 14px; border-radius: 6px; background: linear-gradient(90deg, var(--line-2) 25%, #f3f5f9 50%, var(--line-2) 75%); background-size: 200% 100%; animation: shimmer 1.2s linear infinite; }
@keyframes shimmer { to { background-position: -200% 0; } }
.form-section { display: grid; gap: 14px; padding: 18px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); }
.form-section > h3 { display: flex; align-items: center; gap: 8px; padding-bottom: 10px; border-bottom: 1px solid var(--line-2); }
.form-section > h3 .step { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--brand); color: #fff; font-size: .7333rem; font-weight: 700; }
.wizard { display: grid; gap: 14px; }
@media (max-width: 860px) { .kpi-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .kpi { padding: 12px; gap: 10px; } .kpi-ic { width: 38px; height: 38px; } .kpi-body b { font-size: 1.4rem; } .topbar .user, .topbar .help, .gsearch .kbd { display: none; } .ph-icon { display: none; } .dt { min-width: 760px; } .activity { align-items: start; } }
.cols.wide-side { grid-template-columns: minmax(0, 1fr) minmax(300px, 380px); }
.cols2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.chip.violet { --dot: var(--violet); color: #5b21b6; background: var(--violet-bg); border-color: #e2d6ff; }
.topbar .date { display: none; }
@media (max-width: 1100px) { .cols.wide-side { grid-template-columns: minmax(0, 1fr); } }

.panel > h2.ph { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.panel > h2.ph svg { width: 18px; height: 18px; color: var(--brand); }
.panel > h2.ph .act { margin-left: auto; font-size: .8rem; color: var(--brand); font-weight: 600; text-decoration: none; }
.panel > h2 .n { margin-left: auto; font-size: .8rem; color: var(--ink-3); font-weight: 600; }
.kpi-grid-2.x8 { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.people { margin-top: 20px; }
@media (max-width: 860px) { .kpi-grid-2.x8 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Ajustes de QA visual (12 oct): encabezado, KPI, tabla de viajes, paneles laterales, usuario en barra superior */
.page-head > .ph-icon { margin-right: 0; }
.kpi-label, .kpi-sub { white-space: normal; line-height: 1.2; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kpi-label { font-size: .8667rem; }
.kpi-body b { font-size: 1.6rem; }
.dt td:first-child, .dt td:nth-child(2) { white-space: nowrap; }
.dt td .small { white-space: nowrap; }
.cols2 { grid-template-columns: minmax(0, 1fr); }
.topbar .user b, .topbar .user small { white-space: nowrap; }
.mini-list .avatar { flex: none; }
@media (min-width: 1700px) { .cols.wide-side { grid-template-columns: minmax(0, 1fr) 400px; } .cols2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* ---------- Cotizador inteligente: editor masivo, panel lateral, vista previa paginada ---------- */
.page.full { max-width: none; padding-bottom: 120px; }
.qw { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 16px; align-items: start; }
.qw-main { min-width: 0; }
.qw-side { position: sticky; top: 72px; display: grid; gap: 12px; max-height: calc(100dvh - 90px); overflow: auto; }
.qw-tools { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 8px 10px; margin-bottom: 10px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); position: sticky; top: 62px; z-index: 12; }
.qw-tools .sep { width: 1px; height: 24px; background: var(--line); margin: 0 4px; }
.qw-tools .grow { flex: 1; }
.qw-tools input[type="search"] { min-height: 32px; width: 200px; }
.qw-tools select { min-height: 32px; width: auto; }
.save-state { display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; color: var(--ink-3); white-space: nowrap; }
.save-state i { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); }
.save-state.dirty i { background: var(--wait); } .save-state.saving i { background: var(--brand); animation: pulse 1s infinite; } .save-state.error i { background: var(--lock); }
.grid-wrap { border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); overflow: auto; max-height: calc(100dvh - 250px); }
table.qgrid { border-collapse: separate; border-spacing: 0; width: max-content; min-width: 100%; font-size: .8667rem; }
.qgrid th { position: sticky; top: 0; z-index: 3; background: var(--subtle); border-bottom: 1px solid var(--line); border-right: 1px solid var(--line-2); padding: 7px 8px; text-align: left; font-size: .6933rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); white-space: nowrap; }
.qgrid td { border-bottom: 1px solid var(--line-2); border-right: 1px solid var(--line-2); padding: 0; vertical-align: top; background: var(--surface); }
.qgrid tr.sel td { background: var(--brand-bg); }
.qgrid tr:hover td { background: var(--subtle); }
.qgrid tr.sel:hover td { background: var(--brand-bg); }
.qgrid .c-sel, .qgrid .c-line { position: sticky; z-index: 2; }
.qgrid .c-sel { left: 0; width: 34px; min-width: 34px; text-align: center; }
.qgrid .c-line { left: 34px; width: 46px; min-width: 46px; }
.qgrid .c-desc { position: sticky; left: 80px; z-index: 2; min-width: 300px; box-shadow: 2px 0 0 var(--line); }
.qgrid th.c-sel, .qgrid th.c-line, .qgrid th.c-desc { z-index: 4; }
.qgrid td input, .qgrid td select, .qgrid td textarea { width: 100%; min-height: 36px; padding: 6px 8px; border: 1px solid transparent; border-radius: 0; background: transparent; box-shadow: none; font-size: .8667rem; }
.qgrid td textarea { min-height: 36px; height: 36px; resize: none; line-height: 1.35; overflow: hidden; }
.qgrid td textarea:focus { height: auto; min-height: 90px; overflow: auto; }
.qgrid td input:focus, .qgrid td select:focus, .qgrid td textarea:focus { outline: 0; border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); background: #fff; }
.qgrid td input.num { text-align: right; font-variant-numeric: tabular-nums; }
.qgrid td.calc { padding: 8px; text-align: right; font-variant-numeric: tabular-nums; color: var(--ink-2); white-space: nowrap; }
.qgrid td.calc b { color: var(--ink); }
.qgrid td.calc.low { color: var(--lock); font-weight: 600; }
.qgrid td.line { padding: 8px 6px; color: var(--ink-3); font-weight: 600; text-align: center; }
.qgrid td.bad input, .qgrid td.bad textarea { background: var(--lock-bg); }
.qgrid td.warn input { background: var(--wait-bg); }
.qgrid .thumb { display: grid; place-items: center; width: 58px; height: 44px; margin: 2px auto; border: 1px dashed var(--line); border-radius: 6px; background: var(--subtle); cursor: pointer; overflow: hidden; color: var(--ink-4); }
.qgrid .thumb img { width: 100%; height: 100%; object-fit: contain; }
.qgrid .thumb:hover { border-color: var(--brand); color: var(--brand); }
.qgrid .thumb svg { width: 16px; height: 16px; }
.qgrid td.st select { font-size: .7867rem; }
.qgrid .w-xs { width: 70px; min-width: 70px; } .qgrid .w-sm { width: 96px; min-width: 96px; } .qgrid .w-md { width: 130px; min-width: 130px; } .qgrid .w-lg { width: 190px; min-width: 190px; }
.qgrid tr.hidden-row { display: none; }
.qsum { position: sticky; bottom: 0; z-index: 11; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin-top: 10px; padding: 10px 16px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--navy); color: #fff; box-shadow: var(--shadow-lg); font-size: .8667rem; }
.qsum b { font-size: 1.0667rem; letter-spacing: -.01em; }
.qsum .k { color: #c6d2e6; font-size: .7333rem; text-transform: uppercase; letter-spacing: .06em; display: block; }
.qsum .warn { color: #fde68a; }
.qsum .grow { flex: 1; }
.qsum .btn { min-height: 32px; }
.qw-side .panel { padding: 12px 14px; }
.qw-side .panel h2 { display: flex; align-items: center; gap: 6px; font-size: .9333rem; margin-bottom: 8px; }
.qw-side .seg { margin-bottom: 8px; }
.hist { display: grid; gap: 6px; }
.hist > div { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--subtle); font-size: .8rem; }
.hist img, .hist .noimg { width: 44px; height: 36px; object-fit: contain; border-radius: 4px; background: #fff; border: 1px solid var(--line-2); }
.hist b { display: block; font-size: .8267rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hist small { color: var(--ink-3); display: block; }
.dropzone { display: grid; place-items: center; gap: 4px; min-height: 120px; padding: 12px; border: 2px dashed var(--line); border-radius: 10px; background: var(--subtle); text-align: center; font-size: .8267rem; color: var(--ink-3); cursor: pointer; }
.dropzone.over { border-color: var(--brand); background: var(--brand-bg); }
.dropzone img { max-width: 100%; max-height: 180px; object-fit: contain; border-radius: 6px; background: #fff; }
.offer { padding: 8px 10px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--subtle); font-size: .8267rem; display: grid; gap: 3px; }
.offer.chosen { border-color: var(--ok-line); background: var(--ok-bg); }
.offer .top { display: flex; gap: 6px; align-items: center; }
.offer .top b { margin-right: auto; }
.cols-pop { position: relative; }
.cols-pop > div { position: absolute; right: 0; top: calc(100% + 6px); z-index: 30; width: 260px; max-height: 60vh; overflow: auto; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow-lg); display: grid; gap: 4px; }
.cols-pop label { display: flex; gap: 8px; align-items: center; font-size: .8667rem; min-height: 28px; }
.imp-wrap { display: grid; gap: 12px; }
.imp-src { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.imp-src label { display: grid; gap: 6px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); font-weight: 600; font-size: .8667rem; cursor: pointer; }
.imp-src label span { font-weight: 400; color: var(--ink-3); font-size: .8rem; }
.imp-src input[type="file"] { font-size: .8rem; min-height: 32px; }
.imp-review td.issue { color: #b45309; font-size: .7867rem; }
.qw-top { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: start; margin-bottom: 12px; }
.qw-top .meta { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; color: var(--ink-2); font-size: .8933rem; margin-top: 4px; }
.qw-top .acts { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
@media (max-width: 1100px) { .qw { grid-template-columns: minmax(0, 1fr); } .qw-side { position: static; max-height: none; } .qw-tools { top: 56px; } }
@media (max-width: 860px) { .qw-tools { position: static; } .grid-wrap { max-height: none; } .qgrid .c-desc { position: static; box-shadow: none; } .qsum { position: static; } .qw-top { grid-template-columns: minmax(0, 1fr); } }
/* Vista previa paginada del documento */
.pv-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); position: sticky; top: 62px; z-index: 12; }
.pv-bar .grow { flex: 1; }
.pv-bar .pages { font-size: .8667rem; color: var(--ink-2); white-space: nowrap; }
.pv-stage { overflow: auto; padding: 16px 0 40px; background: #e9edf3; border-radius: var(--r-lg); }
.pv-scale { transform-origin: top left; margin: 0; width: max-content; }
.qpage { position: relative; width: 8.5in; height: 11in; margin: 0 auto 18px; padding: .55in .6in .6in; background: #fff; box-shadow: 0 10px 30px -14px rgb(11 31 58 / .35); color: #14213d; font-size: 9.2pt; line-height: 1.32; overflow: hidden; display: flex; flex-direction: column; }
.qpage.a4 { width: 210mm; height: 297mm; }
.qdoc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding-bottom: 8pt; border-bottom: 2px solid #155eef; margin-bottom: 8pt; }
.qdoc-head img { width: 2.1in; height: auto; }
.qdoc-head .id { text-align: right; }
.qdoc-head .id h1 { font-size: 15pt; font-weight: 700; letter-spacing: .02em; color: #0b1f3a; margin: 0 0 4pt; }
.qdoc-head .id table { margin-left: auto; border-collapse: collapse; font-size: 8.4pt; }
.qdoc-head .id th { padding: 2pt 8pt 2pt 0; text-align: left; color: #64748b; font-weight: 600; }
.qdoc-head .id td { padding: 2pt 0; font-weight: 700; }
.qdoc-cont { font-size: 8pt; color: #64748b; margin-bottom: 6pt; }
.qdoc-parties { display: grid; grid-template-columns: 1fr 1fr; gap: 10pt; margin-bottom: 8pt; }
.qdoc-box { border: 1px solid #dbe3ee; border-radius: 4pt; padding: 6pt 8pt; min-height: 54pt; }
.qdoc-box h2 { font-size: 7.4pt; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #155eef; margin: 0 0 3pt; }
.qdoc-box p { margin: 0; white-space: pre-line; font-size: 8.6pt; }
.qdoc-strip { display: grid; grid-template-columns: repeat(6, 1fr); border: 1px solid #dbe3ee; border-radius: 4pt; margin-bottom: 8pt; overflow: hidden; }
.qdoc-strip div { padding: 4pt 6pt; border-right: 1px solid #dbe3ee; font-size: 8.2pt; min-width: 0; }
.qdoc-strip div:last-child { border-right: 0; }
.qdoc-strip small { display: block; font-size: 6.8pt; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #64748b; }
table.qdoc-items { width: 100%; border-collapse: collapse; table-layout: fixed; }
.qdoc-items th { background: #0b1f3a; color: #fff; font-size: 6.8pt; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 4pt 4pt; text-align: left; white-space: nowrap; overflow: hidden; }
.qdoc-items th.r, .qdoc-items td.r { text-align: right; } .qdoc-items th.c, .qdoc-items td.c { text-align: center; }
.qdoc-items td { padding: 4pt 5pt; border-bottom: 1px solid #e6ebf2; vertical-align: top; font-size: 8.4pt; overflow-wrap: anywhere; }
.qdoc-items td.c, .qdoc-items td.um { overflow-wrap: normal; }
.qdoc-items tr:nth-child(even) td { background: #f8fafc; }
.qdoc-items td.desc { white-space: pre-line; }
.qdoc-items td.desc small { display: block; color: #64748b; font-size: 7.4pt; }
.qdoc-items td.img { padding: 3pt; }
.qdoc-items td.img img { display: block; max-width: 100%; max-height: 62pt; object-fit: contain; margin: 0 auto; }
.qdoc-items td.num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.qdoc-cont-row td { color: inherit; }
.qdoc-cont-row td.desc i, .qdoc-cont-row .pb-head i { color: #6b7a90; font-size: 7.8pt; font-weight: 500; }
.qdoc-foot-block { display: grid; grid-template-columns: minmax(0, 1fr) 2.4in; gap: 14pt; margin-top: 10pt; }
.qdoc-terms h2 { font-size: 7.4pt; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #155eef; margin: 0 0 3pt; }
.qdoc-terms p { margin: 0 0 2pt; font-size: 8.2pt; }
.qdoc-terms p.obs { white-space: pre-line; }
.qdoc-sum { border-collapse: collapse; width: 100%; font-size: 8.6pt; }
.qdoc-sum th { text-align: left; font-weight: 600; color: #64748b; padding: 3pt 6pt; border-bottom: 1px solid #e6ebf2; }
.qdoc-sum td { text-align: right; padding: 3pt 6pt; border-bottom: 1px solid #e6ebf2; font-variant-numeric: tabular-nums; }
.qdoc-sum tr.grand th, .qdoc-sum tr.grand td { background: #0b1f3a; color: #fff; font-weight: 700; font-size: 9.6pt; border: 0; }
.qdoc-sign { margin-top: 14pt; text-align: center; font-size: 8.2pt; }
.qdoc-sign .name { margin-top: 20pt; padding-top: 4pt; border-top: 1px solid #14213d; display: inline-block; min-width: 2in; }
.qpage-foot { margin-top: auto; padding-top: 6pt; border-top: 1px solid #dbe3ee; display: flex; justify-content: space-between; gap: 12pt; font-size: 7.2pt; color: #64748b; }
.qpage-foot b { color: #0b1f3a; }
.pv-measure { position: absolute; left: -9999px; top: 0; width: 7.3in; visibility: hidden; font-size: 9.2pt; line-height: 1.32; color: #14213d; }
.pv-measure.a4 { width: calc(210mm - 1.2in); }
@media print { .pv-bar, .qw-tools, .qsum, .topbar, .rail { display: none !important; } .pv-stage { overflow: visible; padding: 0; margin: 0; background: #fff; border-radius: 0; } .pv-scale { transform: none !important; width: auto !important; height: auto !important; margin: 0 !important; } .qpage { margin: 0 !important; box-shadow: none; break-after: page; page-break-after: always; break-inside: avoid; } .qpage:last-child { break-after: auto; page-break-after: auto; } .page, main { padding: 0 !important; } .pv-measure { display: none !important; } }
.dlg-back { place-items: start center; overflow: auto; padding: 24px 16px; }
.dlg { margin: 0; max-height: calc(100dvh - 48px); overflow: auto; }

/* ===== Cotizador 2.0: encabezado, herramientas, panel y estados ===== */
.qw-top .meta { gap: 6px 8px; }
.mchip { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; padding: 0 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); font-size: .8267rem; color: var(--ink); white-space: nowrap; max-width: 100%; }
.mchip small { color: var(--ink-3); font-size: .7067rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; }
.mchip .chip { min-height: 20px; padding: 0 7px; font-size: .72rem; }
.mchip a { color: var(--brand); text-decoration: none; font-weight: 500; }
.qw-tools { gap: 6px 4px; padding: 6px 8px; }
.qw-tools .btn.sm { min-height: 32px; padding: 0 9px; font-size: .8267rem; }
.qw-tools .seg.quick { padding: 2px; }
.qw-tools .seg.quick button { min-height: 28px; padding: 0 9px; font-size: .8rem; }
.qw-tools .seg.quick .n:empty { display: none; }
.save-state.conflict i { background: var(--lock); animation: pulse .8s infinite; }
.save-state.saved i { box-shadow: 0 0 0 3px rgb(18 183 106 / .18); }
.qw.side-closed { grid-template-columns: minmax(0, 1fr); }
.qw.side-closed .qw-side { display: none; }
.rdot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 5px; vertical-align: 1px; background: var(--ok); }
.rdot.pend { background: var(--wait); } .rdot.noq { background: #94a3b8; } .rdot.excl { background: var(--lock); }
.qgrid tr.st-excl td:not(.c-sel):not(.c-line) { opacity: .5; text-decoration: line-through; }
.qgrid tr.st-noq td:not(.c-sel):not(.c-line) { opacity: .7; }
.qgrid tr.st-pend td.c-line { box-shadow: inset 3px 0 0 var(--wait); }
.qw-side .kv { display: grid; gap: 10px; font-size: .8933rem; }
.qw-side .kv small, .kv2 small { display: block; color: var(--ink-3); font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; margin-bottom: 2px; }
.qw-side .kv p { margin: 0; line-height: 1.45; max-height: 220px; overflow: auto; }
.kv2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; font-size: .8933rem; }
.qw-side textarea { width: 100%; min-height: 64px; font: inherit; font-size: .8667rem; }
.qsum .small { font-size: .7467rem; color: #c6d2e6; }
.qsum > span.warn b { color: #fde68a; }
.pv-loading { display: flex; align-items: center; gap: 10px; justify-content: center; padding: 60px 0; color: var(--ink-3); font-size: .8933rem; }
.pv-bar .seg.tpl .btn { min-height: 28px; }
.upload.slim { display: flex; gap: 6px; flex-wrap: wrap; }
.upload.slim select, .upload.slim input { min-height: 32px; font-size: .8267rem; }
@media (min-width: 1700px) { .qw { grid-template-columns: minmax(0, 1fr) 420px; } }
@media (min-width: 2400px) { .qw { grid-template-columns: minmax(0, 1fr) 480px; } .qgrid .c-desc { min-width: 520px; width: 620px; max-width: 620px; } .qgrid .w-sm { width: 130px; min-width: 130px; } .qgrid .w-md { width: 170px; min-width: 170px; } .qgrid .w-lg { width: 240px; min-width: 240px; } .qgrid .w-xs { width: 84px; min-width: 84px; } }
@media (max-width: 1100px) { .qw.side-closed .qw-side, .qw .qw-side { display: block; } .qw-top .acts .btn { padding: 0 10px; } }
@media (max-width: 860px) { .qw-top .meta .mchip { min-height: 26px; font-size: .78rem; } .qw-top .acts { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; } .qw-top .acts .btn { flex: none; } .qw-tools { gap: 6px; } .qw-tools input[type="search"] { width: 100%; } .qw-tools .seg.quick { width: 100%; overflow-x: auto; flex-wrap: nowrap; } .qw-tools .seg.quick button { flex: none; } .qsum { gap: 6px 14px; padding: 10px 12px; } .kv2 { grid-template-columns: 1fr; } }

/* ===== PDF: refinamiento tipográfico común (A y B) ===== */
.qpage { font-size: 9.4pt; line-height: 1.36; padding: .5in .55in .55in; }
.qdoc-head { border-bottom: 1.5px solid #0b1f3a; padding-bottom: 9pt; margin-bottom: 9pt; }
.qdoc-head .id h1 { font-size: 16pt; letter-spacing: .06em; }
.qdoc-head .id th { color: #6b7a90; font-weight: 500; letter-spacing: .02em; }
.qdoc-box { border: 0; border-radius: 0; padding: 0 4pt; min-height: 0; background: transparent; }
.qdoc-box h2 { color: #0b1f3a; letter-spacing: .1em; padding-bottom: 2pt; margin-bottom: 4pt; border-bottom: 1px solid #dbe3ee; }
.qdoc-box p { font-size: 8.8pt; line-height: 1.38; }
.qdoc-strip { border: 0; border-top: 1px solid #dbe3ee; border-bottom: 1px solid #dbe3ee; border-radius: 0; }
.qdoc-strip div { border-right: 1px solid #e6ebf2; padding: 5pt 8pt; font-size: 8.6pt; }
.qdoc-strip small { color: #6b7a90; font-weight: 600; letter-spacing: .08em; }
.qdoc-items th { font-size: 7.2pt; padding: 5pt 5pt; letter-spacing: .06em; }
.qdoc-items td { font-size: 8.8pt; padding: 5pt 5pt; border-bottom: 1px solid #e9eef4; }
.qdoc-items td.pn { font-variant-numeric: tabular-nums; font-weight: 600; color: #0b1f3a; }
.qdoc-items td.num { font-size: 9pt; }
.qdoc-items tr:nth-child(even) td { background: transparent; }
.qdoc-items td.desc small { font-size: 7.8pt; margin-top: 1pt; }
.qdoc-items td.img img { max-height: 66pt; }
.nq { color: #6b7a90; font-style: italic; font-weight: 500; }
.nq-row td.desc, .nq-row td.prod { color: #475569; }
.qdoc-sum th { font-size: 8.4pt; } .qdoc-sum td { font-size: 9pt; }
.qdoc-sum tr.grand th, .qdoc-sum tr.grand td { font-size: 10pt; padding: 5pt 8pt; }
.qdoc-terms p { font-size: 8.5pt; line-height: 1.4; }
.qdoc-sign { font-size: 8.5pt; }
.qpage-foot { font-size: 7.4pt; line-height: 1.4; }
.pv-measure { font-size: 9.4pt; line-height: 1.36; width: 7.4in; }
.pv-measure.a4 { width: calc(210mm - 1.1in); }

/* ===== PDF plantilla B — Corporativo técnico industrial ===== */
.tpl-tecnico .qdoc-items th { background: #f1f5fb; color: #0b1f3a; border-bottom: 1.5px solid #0b1f3a; font-size: 7.4pt; }
.tpl-tecnico .qdoc-items td { padding: 7pt 6pt; border-bottom: 1px solid #dbe3ee; }
.tpl-tecnico .qdoc-items td.c { font-weight: 600; }
.tpl-tecnico .pb { display: flex; gap: 8pt; align-items: flex-start; }
.tpl-tecnico .pb-img { flex: none; width: 70pt; height: 70pt; display: grid; place-items: center; border: 1px solid #e6ebf2; border-radius: 3pt; background: #fff; padding: 2pt; }
.tpl-tecnico .pb-img img { max-width: 64pt; max-height: 64pt; width: auto; height: auto; object-fit: contain; display: block; }
.tpl-tecnico .pb-txt { min-width: 0; flex: 1; }
.tpl-tecnico .pb-head { font-weight: 700; color: #0b1f3a; font-size: 9pt; margin-bottom: 1.5pt; }
.tpl-tecnico .pb-desc { white-space: pre-line; font-size: 8.6pt; line-height: 1.38; color: #1e293b; }
.tpl-tecnico .pb-pn { font-size: 7.8pt; color: #6b7a90; margin-top: 2pt; font-variant-numeric: tabular-nums; }
.tpl-tecnico .qdoc-head { border-bottom: 3px double #0b1f3a; }
.tpl-tecnico .qdoc-sum tr.grand th, .tpl-tecnico .qdoc-sum tr.grand td { background: #0b1f3a; }
.qsum .btn.ghost { background: rgb(255 255 255 / .08); color: #fff; border: 1px solid rgb(255 255 255 / .22); box-shadow: none; white-space: nowrap; }
.qsum .btn.ghost:hover { background: rgb(255 255 255 / .16); }
.qsum > span { white-space: nowrap; }
@media (max-width: 1500px) { .qsum > span .small { display: none; } .qsum { gap: 6px 14px; padding: 8px 12px; } .qsum b { font-size: .9733rem; } .qsum .btn.ghost { min-height: 28px; font-size: .76rem; } }
.dlg [data-dec] { min-width: 250px; }
.qdoc-items td.pn-long { font-size: 7.6pt; font-weight: 600; letter-spacing: -.01em; }

/* Auditoría 13 oct: contenedores de rejilla/flex no deben forzar scroll horizontal de la página en celular */
.cols > *, .cols2 > *, .kpi-grid > *, .kpi-grid-2 > *, .panel, .qw-main, .page > section { min-width: 0; }
.scroll-x { max-width: 100%; position: relative; }   /* hijos absolutos (barras, tooltips) quedan dentro del recorte */
@media (max-width: 860px) { .qw-tools .seg.quick button, .pv-bar .seg.tpl .btn, .dt a.btn.sm, .row a.btn.sm, .qsum .btn.ghost { min-height: 36px; } .seg.tabs { max-width: 100%; } }
.act-item { min-width: 0; } .act-item > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; } .act-item b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: inline-block; vertical-align: bottom; }
label.f select, label.f input, .filters select { max-width: 100%; min-width: 0; }
@media (max-width: 860px) { .list { overflow-x: auto; } .row.rp { min-width: 720px; grid-template-columns: minmax(180px, 1fr) repeat(4, 110px) 64px; } .row.st { min-width: 680px; } .row.cf { min-width: 600px; } }

/* ===== Evolución premium · comparador de ofertas ===== */
.offer.v2 { background: var(--surface); border-color: var(--line); gap: 6px; }
.offer.v2.best { box-shadow: inset 0 0 0 1px var(--brand); }
.offer.v2.chosen { background: var(--ok-bg); border-color: var(--ok-line); }
.offer .top { flex-wrap: wrap; }
.offer .top .chip { min-height: 20px; padding: 0 7px; font-size: .7rem; }
.ofg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 10px; padding: 6px 8px; border-radius: 6px; background: var(--subtle); font-size: .8rem; font-variant-numeric: tabular-nums; }
.ofg small { display: block; color: var(--ink-3); font-size: .64rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; }
.ofg .tot b { color: var(--ink); font-size: .8933rem; }
.ofg .tot { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding-top: 4px; border-top: 1px solid var(--line-2); }

/* ===== Evolución premium · ficha de producto ===== */
.prod-head { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; gap: 18px; align-items: start; padding: 18px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); }
.prod-head .pimg { width: 120px; height: 120px; display: grid; place-items: center; border: 1px solid var(--line-2); border-radius: 10px; background: var(--subtle); overflow: hidden; }
.prod-head .pimg img { width: 100%; height: 100%; object-fit: contain; }
.prod-head .pimg .noimg svg { width: 36px; height: 36px; color: var(--ink-4); }
.prod-head h1 { font-size: 1.35rem; margin: 0 0 6px; }
.prod-head .meta { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.pstats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px 16px; }
.pstats span { display: grid; gap: 1px; min-width: 0; }
.pstats small { color: var(--ink-3); font-size: .7067rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; }
.pstats b { font-size: 1.0667rem; letter-spacing: -.01em; }
.pstats i { font-style: normal; color: var(--ink-3); font-size: .76rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pacts { display: flex; flex-direction: column; gap: 6px; }
@media (max-width: 860px) { .prod-head { grid-template-columns: 84px minmax(0, 1fr); } .prod-head .pimg { width: 84px; height: 84px; } .pacts { grid-column: 1 / -1; flex-direction: row; } }
.optl { display: grid; }
.optl-row { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 4px; border-bottom: 1px solid var(--line-2); text-decoration: none; color: inherit; font-size: .8933rem; }
.optl-row:last-child { border-bottom: 0; }
.optl-row .when { color: var(--ink-3); font-size: .8rem; white-space: nowrap; }
.optl-row .what { min-width: 0; } .optl-row .what small { display: block; color: var(--ink-3); font-size: .78rem; }
@media (max-width: 860px) { .optl-row { grid-template-columns: minmax(0, 1fr) auto; } .optl-row .when { grid-column: 1 / -1; } }

/* ===== Evolución premium · Mi centro ===== */
.my-center { margin: 4px 0 18px; }
.my-center .sec-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; } .my-center .sec-head h2 { display: flex; align-items: center; gap: 8px; font-size: 1.0667rem; margin: 0; } .my-center .sec-head .btn { margin-left: auto; }
.my-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; }
.my-block { padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); min-width: 0; }
.my-block header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; } .my-block header h3 { font-size: .9333rem; margin: 0; flex: 1; min-width: 0; } .my-block header svg { width: 16px; height: 16px; color: var(--brand); } .my-block header .n { min-width: 22px; padding: 0 6px; border-radius: 11px; background: var(--brand-bg); color: var(--brand-ink); font-size: .7333rem; font-weight: 600; line-height: 22px; text-align: center; }
.my-block.tone-bad header .n { background: var(--lock-bg); color: var(--lock); } .my-block.tone-wait header .n { background: var(--wait-bg); color: var(--wait-ink); } .my-block.tone-ok header .n { background: var(--ok-bg); color: var(--ok); }
.my-block header .act { font-size: .76rem; color: var(--brand); text-decoration: none; white-space: nowrap; }
.my-block .mini-list > * { padding: 6px 0; } .my-block .mini-list b { font-weight: 500; }
.my-empty { color: var(--ink-3); font-size: .8267rem; margin: 4px 0; }
.my-config { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; } .my-config li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 8px; border: 1px solid var(--line-2); border-radius: 8px; } .my-config .n { color: var(--ink-3); font-size: .76rem; }
@media (min-width: 2400px) { .my-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ===== Evolución premium · Kanban ===== */
.kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(280px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 8px; align-items: start; }
.kb-col { background: #eef1f6; border-radius: var(--r-lg); padding: 8px; min-height: 240px; transition: background .15s, box-shadow .15s; }
.kb-col.over { background: var(--brand-bg); box-shadow: inset 0 0 0 2px var(--brand); }
.kb-col.closed { background: #f3f4f6; opacity: .92; }
.kb-col header { display: flex; align-items: center; gap: 6px; padding: 4px 6px 8px; } .kb-col header h3 { font-size: .8267rem; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-2); margin: 0; flex: 1; } .kb-col header .n { min-width: 20px; padding: 0 6px; border-radius: 10px; background: rgb(15 23 42 / .08); font-size: .7333rem; font-weight: 600; line-height: 20px; text-align: center; } .kb-col header small { display: block; width: 100%; color: var(--ink-3); font-size: .7rem; }
.kb-cards { display: grid; gap: 8px; } .kb-empty { color: var(--ink-4); text-align: center; margin: 24px 0; font-size: .8rem; }
.kb-card { display: grid; gap: 4px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow); cursor: grab; } .kb-card[draggable="false"] { cursor: default; } .kb-card.dragging { opacity: .5; } .kb-card.prio-alta { background: #fff8f7; border-color: #f3c7c3; }
.kb-top { display: flex; align-items: center; gap: 6px; } .kb-top .folio { font-weight: 600; font-size: .8267rem; color: var(--brand); text-decoration: none; } .kb-top .kb-prio { margin-left: auto; }
.kb-title { font-weight: 600; font-size: .8933rem; color: var(--ink); text-decoration: none; line-height: 1.3; } .kb-client { font-size: .8rem; color: var(--ink-2); }
.kb-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: .7467rem; color: var(--ink-3); } .kb-meta span { display: inline-flex; align-items: center; gap: 3px; } .kb-meta svg { width: 12px; height: 12px; } .kb-meta .warn { color: var(--wait-ink); font-weight: 600; } .kb-meta .bad { color: var(--lock); font-weight: 600; }
.kb-foot { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: 2px; }
.inline-sel { min-height: 24px; padding: 0 4px; font-size: .8rem; border: 0; background: transparent; }
@media (max-width: 860px) { .kanban { grid-auto-columns: 85vw; } }
.kb-card.prio-urgente { background: #fff1f0; border-color: #e9a8a3; }

/* ===== Evolución premium · expediente único ===== */
.op-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: start; margin-bottom: 12px; } .op-head h1 { font-size: 1.35rem; margin: 2px 0 6px; } .op-head .meta { display: flex; flex-wrap: wrap; gap: 6px; } .op-head .acts { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.op-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.op-sub { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; } .op-sub h3 { margin: 0; font-size: 1rem; } .op-sub .btn { margin-left: auto; }
.track-list { display: grid; gap: 10px; } .track { padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); } .track header { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: .8933rem; margin-bottom: 8px; }
.steps-track { list-style: none; margin: 0 0 8px; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 4px; }
.steps-track li { position: relative; padding-top: 14px; font-size: .78rem; color: var(--ink-3); } .steps-track li b { display: block; font-weight: 500; color: var(--ink-2); } .steps-track li small { color: var(--ink-3); }
.steps-track li i { position: absolute; top: 0; left: 0; right: 0; height: 6px; border-radius: 3px; background: var(--line); } .steps-track li.done i { background: var(--ok); } .steps-track li.done b { color: var(--ink); } .steps-track li.next i { background: var(--wait); } .steps-track li.next b { color: var(--wait-ink); font-weight: 600; }
@media (max-width: 860px) { .op-head { grid-template-columns: minmax(0, 1fr); } .steps-track { grid-auto-flow: row; grid-auto-columns: auto; } .steps-track li { padding: 0 0 0 14px; } .steps-track li i { top: 4px; bottom: 4px; left: 0; right: auto; width: 6px; height: auto; } }
.supply-groups { display: grid; gap: 12px; } .track.late { border-color: var(--lock-line); } .track-alerts { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; } .dt tr.late td { background: var(--lock-bg); } .dt td.warn { color: var(--wait-ink); font-weight: 600; } .dt td.bad { color: var(--lock); font-weight: 600; }
@media (min-width: 1700px) { .kpi-grid-2.x6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.kpi-grid-2.x8 { grid-template-columns: repeat(4, minmax(0, 1fr)); } @media (min-width: 2400px) { .kpi-grid-2.x8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } } @media (max-width: 860px) { .kpi-grid-2.x8, .kpi-grid-2.x6 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.kpi-body { min-width: 0; } .kpi-body b { overflow-wrap: anywhere; } .kpi-body b small { white-space: nowrap; }

/* ===== Evolución premium · alertas ===== */
.alert-list { display: grid; } .alert-row { display: flex; align-items: flex-start; gap: 10px; padding: 10px 4px; border-bottom: 1px solid var(--line-2); font-size: .8933rem; } .alert-row:last-child { border-bottom: 0; } .alert-row .rdot { margin-top: 6px; width: 9px; height: 9px; }
.alert-row .grow { min-width: 0; flex: 1; display: grid; gap: 2px; } .alert-row .grow a { color: var(--ink); text-decoration: none; } .alert-row small { color: var(--ink-3); font-size: .78rem; } .alert-row .act-hint { color: var(--brand-ink); display: inline-flex; align-items: center; gap: 4px; } .alert-row .act-hint svg { width: 12px; height: 12px; } .alert-row .meta { font-size: .72rem; }
.alert-row .btn { flex: none; } .alerts-top { margin-bottom: 14px; border-left: 0; } .alerts-top .sec-head { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; } .alerts-top .sec-head h2 { display: flex; align-items: center; gap: 6px; font-size: 1rem; margin: 0; } .alerts-top .act { margin-left: auto; font-size: .8rem; color: var(--brand); text-decoration: none; }
.alert-list.bell { max-height: 300px; overflow: auto; padding: 0 10px; } .alert-list.bell .alert-row { font-size: .8267rem; padding: 8px 0; }
/* Fase 8 · pulido */
.mini-list .grow b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 860px) { .inline-sel { min-height: 36px; } .my-block header .act { min-height: 32px; display: inline-flex; align-items: center; } .kb-card .folio, .kb-title { padding: 2px 0; } }

/* ===== Bandeja general de correos ===== */
.inbox { display: grid; grid-template-columns: minmax(360px, 440px) minmax(0, 1fr); gap: 12px; align-items: start; }
.mail-list { border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); overflow: auto; max-height: calc(100dvh - 330px); }
.mail-row { display: flex; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--line-2); text-decoration: none; color: inherit; } .mail-row:last-child { border-bottom: 0; } .mail-row:hover { background: var(--subtle); } .mail-row.cur { background: var(--brand-bg); box-shadow: inset 3px 0 0 var(--brand); }
.mail-row .avatar { flex: none; margin-top: 2px; } .mail-main { min-width: 0; flex: 1; display: grid; gap: 2px; } .mail-top { display: flex; justify-content: space-between; gap: 8px; } .mail-top .from { font-size: .8933rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .mail-top .when { color: var(--ink-3); font-size: .76rem; white-space: nowrap; }
.mail-row .subj { font-size: .8933rem; font-weight: 500; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .mail-row.mail-unowned .subj { font-weight: 600; } .mail-row .snip { font-size: .8rem; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mail-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; } .mail-chips .chip { min-height: 20px; padding: 0 7px; font-size: .7rem; } .mail-chips .chip svg { width: 11px; height: 11px; }
.mail-pane { min-width: 0; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); min-height: 320px; } .mail-empty { padding: 30px 16px; }
.mail-read { padding: 18px 20px; } .mail-read header { display: grid; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid var(--line-2); margin-bottom: 12px; } .mail-head { display: flex; gap: 12px; align-items: flex-start; } .mail-head h2 { font-size: 1.1333rem; margin: 0 0 4px; }
.mail-acts { display: flex; flex-wrap: wrap; gap: 6px; } .mail-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.mail-atts { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; } .mail-atts .att { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--subtle); text-decoration: none; color: inherit; font-size: .8267rem; } .mail-atts .att svg { width: 18px; height: 18px; color: var(--brand); } .mail-atts .att small { display: block; color: var(--ink-3); } .mail-atts .att:hover { border-color: var(--brand); }
.mail-body { white-space: pre-wrap; font-size: .9333rem; line-height: 1.55; padding: 14px 16px; border: 1px solid var(--line-2); border-radius: 10px; background: #fcfdff; max-height: 60vh; overflow: auto; }
.mail-thread { margin-top: 14px; } .mail-thread h3 { font-size: .8933rem; margin: 0 0 6px; } .mail-thread a { display: block; padding: 6px 8px; border-radius: 8px; text-decoration: none; color: inherit; font-size: .8533rem; } .mail-thread a.cur, .mail-thread a:hover { background: var(--subtle); }
@media (min-width: 2400px) { .inbox { grid-template-columns: 520px minmax(0, 1fr); } }
@media (max-width: 1100px) { .inbox { grid-template-columns: minmax(0, 1fr); } .inbox.has-sel .mail-list { display: none; } .mail-list { max-height: none; } }
@media (max-width: 1100px) { .mail-read .back.m-only { display: inline-flex !important; margin-bottom: 8px; } }
.imp-mail { margin: 8px 0 4px; font-size: .8533rem; } .imp-mail b { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 6px; } .imp-mail b svg { width: 14px; height: 14px; } .imp-atts { display: flex; flex-wrap: wrap; gap: 6px; }

/* ===== Flotilla: tarjetas de unidad, expediente y checklist móvil (14 oct 2026) ===== */
.fl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 12px; }
.fl-card { display: grid; gap: 8px; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); color: inherit; text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.fl-card:hover { border-color: var(--brand); box-shadow: var(--shadow-1); }
.fl-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; } .fl-top b { font-size: 1.0667rem; letter-spacing: -.01em; }
.fl-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; margin-top: 2px; }
.fl-stats span { display: grid; } .fl-stats small { font-size: .6933rem; color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em; } .fl-stats b { font-weight: 500; font-size: .9333rem; } .fl-stats b.bad { color: var(--lock); } .fl-stats i { font-style: normal; font-size: .76rem; color: var(--ink-3); }
.fl-block, .fl-warn { display: flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 8px; font-size: .8rem; font-weight: 500; } .fl-block { background: var(--lock-bg); color: #9f1239; } .fl-warn { background: #fffaeb; color: #b54708; }
.fl-block svg, .fl-warn svg { width: 14px; height: 14px; flex: none; }
.fl-tools-form .actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.dt.tools input, .dt.tools select { min-height: 34px; padding: 4px 8px; font-size: .8667rem; }
/* checklist */
.ck-wrap { max-width: 760px; margin: 0 auto; }
.ck-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin: 6px 0 10px; } .ck-head h1 { margin: 0 0 2px; font-size: 1.2rem; }
.ck-prog { display: grid; gap: 4px; margin-bottom: 12px; font-size: .8rem; color: var(--ink-3); } .ck-prog .bar { height: 8px; border-radius: 99px; background: var(--line-2); overflow: hidden; } .ck-prog .bar i { display: block; height: 100%; width: 100%; background: var(--brand); border-radius: 99px; transform-origin: left; transform: scaleX(var(--p, 0)); transition: transform .25s; }
.ck-general { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin-bottom: 12px; } .ck-general .wide { grid-column: 1 / -1; }
.ck-cat { border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); margin-bottom: 10px; overflow: hidden; }
.ck-cat summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; font-weight: 600; cursor: pointer; list-style: none; min-height: 52px; } .ck-cat summary::-webkit-details-marker { display: none; }
.ck-cat summary::before { content: ''; width: 8px; height: 8px; border-right: 2px solid var(--ink-3); border-bottom: 2px solid var(--ink-3); transform: rotate(-45deg); margin-right: 8px; transition: transform .15s; } .ck-cat[open] summary::before { transform: rotate(45deg); }
.ck-count { font-size: .78rem; font-weight: 600; color: var(--ink-3); padding: 2px 8px; border-radius: 99px; background: var(--bg-2); } .ck-count.ok { color: #067647; background: #ecfdf3; }
.ck-items { border-top: 1px solid var(--line-2); }
.ck-item { padding: 12px 16px; border-bottom: 1px solid var(--line-2); display: grid; gap: 8px; } .ck-item:last-child { border-bottom: 0; }
.ck-item.r-critica { background: #fff5f5; } .ck-item.r-atencion { background: #fffcf2; }
.ck-label { display: flex; align-items: center; justify-content: space-between; gap: 8px; } .ck-label b { font-weight: 500; }
.ck-opts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.ck-btn { min-height: 46px; padding: 6px 4px; border-radius: 10px; border: 1px solid var(--line); background: var(--bg); font: inherit; font-size: .8rem; font-weight: 600; color: var(--ink-2); cursor: pointer; touch-action: manipulation; }
.ck-btn.ok.on { background: #ecfdf3; border-color: #abefc6; color: #067647; } .ck-btn.warn.on { background: #fffaeb; border-color: #fedf89; color: #b54708; } .ck-btn.bad.on { background: #fef3f2; border-color: #fecdca; color: #b42318; } .ck-btn.na.on { background: var(--bg-2); border-color: var(--ink-3); color: var(--ink); }
.ck-btn:disabled { cursor: default; opacity: .7; }
.ck-more { display: grid; gap: 6px; } .ck-more textarea, .ck-more input { width: 100%; }
.ck-photo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .ck-photo img { height: 64px; width: 64px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); }
.ck-foot { display: grid; gap: 10px; padding: 14px 16px; margin-top: 12px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); position: sticky; bottom: 8px; box-shadow: var(--shadow-2); }
.ck-foot-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .ck-foot-btns .btn { min-height: 46px; justify-content: center; }
.ck-foot .check { min-height: 32px; font-size: .8933rem; }
.fl-tl { display: grid; }
.ck-report .kv2 > div { display: grid; gap: 2px; } .ck-report .kv2 small { color: var(--ink-3); font-size: .7067rem; text-transform: uppercase; letter-spacing: .05em; }
@media (max-width: 600px) { .ck-opts { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ck-head { flex-direction: column; } .fl-grid { grid-template-columns: 1fr; } .ck-foot { padding: 10px 12px; gap: 8px; } }

/* ===== HT AI Operations (22 oct 2026): equipo, análisis de correos, memoria ===== */
.wl-bar { height: 8px; border-radius: 99px; background: var(--line-2); overflow: hidden; margin-bottom: 3px; } .wl-bar i { display: block; height: 100%; border-radius: 99px; background: var(--ok); } .wl-bar i.normal { background: var(--brand); } .wl-bar i.alta { background: var(--lock); }
.sup-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 12px; } .sup-card.cur { border-color: var(--brand); box-shadow: 0 0 0 3px rgb(37 99 235 / .12); }
.sup-items { display: grid; gap: 4px; margin: 6px 0 10px; max-height: 240px; overflow: auto; padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; } .sup-items .check { min-height: 28px; font-weight: 400; }
.kpi-grid-2.x5 { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
/* correos: tercera columna de análisis */
.mail-intel { min-width: 0; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow); padding: 14px 16px; display: grid; gap: 12px; align-content: start; position: sticky; top: 72px; max-height: calc(100dvh - 90px); overflow: auto; }
.mail-intel h3 { display: flex; align-items: center; gap: 6px; font-size: .8933rem; margin: 0 0 6px; } .mail-intel h3 svg { width: 15px; height: 15px; color: var(--brand); }
.mail-intel .kv2 { gap: 6px 10px; } .mail-intel .kv2 small { display: block; color: var(--ink-3); font-size: .7067rem; text-transform: uppercase; letter-spacing: .05em; }
.intel-items { display: grid; gap: 4px; font-size: .8267rem; } .intel-items > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; padding: 6px 8px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--subtle); } .intel-items b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; } .intel-items small { color: var(--ink-3); }
.intel-pending { margin: 0; padding-left: 18px; font-size: .8267rem; color: #b54708; } .intel-pending li { margin: 2px 0; }
.intel-draft { white-space: pre-wrap; font-size: .8267rem; line-height: 1.5; padding: 10px 12px; border: 1px solid var(--line-2); border-radius: 8px; background: #fcfdff; max-height: 240px; overflow: auto; }
@media (min-width: 1500px) { .inbox.has-sel { grid-template-columns: minmax(320px, 380px) minmax(0, 1fr) minmax(300px, 380px); } }
@media (min-width: 2400px) { .inbox.has-sel { grid-template-columns: 460px minmax(0, 1fr) 460px; } }
@media (max-width: 1499px) { .mail-intel { position: static; max-height: none; } }
/* memoria en el cotizador */
.mem-badge { display: inline-flex; align-items: center; gap: 4px; padding: 1px 7px; border-radius: 99px; font-size: .7rem; font-weight: 600; } .mem-badge.sku, .mem-badge.modelo { background: #ecfdf3; color: #067647; } .mem-badge.probable { background: #fffaeb; color: #b54708; } .mem-badge.equivalente { background: var(--bg-2); color: var(--ink-2); }
.mem-summary { padding: 8px 10px; border-radius: 8px; background: var(--subtle); border: 1px solid var(--line-2); font-size: .8267rem; margin-bottom: 8px; }
.src-grid { display: grid; gap: 8px; } .src-card { padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); display: grid; gap: 4px; font-size: .8533rem; } .src-card .top { display: flex; align-items: center; justify-content: space-between; gap: 8px; } .src-card .top b { font-weight: 600; }

.my-workload { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding: 10px 14px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); font-size: .8933rem; } .my-workload small { color: var(--ink-3); text-transform: uppercase; letter-spacing: .05em; font-size: .7067rem; } .my-workload select { min-height: 32px; width: auto; }
@media (max-width: 1499px) { .inbox.has-sel .mail-intel { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px 24px; } }