:root{
  --bg:#f5f4ef; --surface:#ffffff; --surface-2:#eceae2;
  --ink:#1d2420; --ink-soft:#5b655d; --border:rgba(29,36,32,0.14);
  --accent:#3f6b35; --accent-soft:rgba(63,107,53,0.12);
  --good:#2f6f8f; --good-soft:rgba(47,111,143,0.12);
  --warn:#b25b2e; --warn-soft:rgba(178,91,46,0.12);
  --danger:#a4372e; --danger-soft:rgba(164,55,46,0.12);
  --neutral-soft:rgba(29,36,32,0.06);
  --sidebar-bg:#eeece3;
  --shadow: 0 1px 2px rgba(29,36,32,0.06), 0 8px 24px -12px rgba(29,36,32,0.18);
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#13160f; --surface:#1a1e15; --surface-2:#20251a;
    --ink:#e9e7dd; --ink-soft:#a3a99a; --border:rgba(233,231,221,0.14);
    --accent:#8ad071; --accent-soft:rgba(138,208,113,0.14);
    --good:#79c1e0; --good-soft:rgba(121,193,224,0.14);
    --warn:#e2915a; --warn-soft:rgba(226,145,90,0.14);
    --danger:#e2716a; --danger-soft:rgba(226,113,106,0.14);
    --neutral-soft:rgba(233,231,221,0.06);
    --sidebar-bg:#181c12;
    --shadow: 0 1px 2px rgba(0,0,0,0.3), 0 8px 24px -12px rgba(0,0,0,0.5);
  }
}
*{box-sizing:border-box;}
/* !important a propósito: una utilidad "hidden" debe ganar siempre. Sin esto, cualquier
   elemento cuya propia clase fije "display" en una regla posterior de esta hoja gana el
   empate de especificidad por ir después — confirmado en real: .ia-section{display:flex}
   (definida más abajo) dejaba .ia-section.hidden con display:flex computado, visible de
   verdad, no solo en la lectura del CSS. */
.hidden{display:none !important;}
html, body{height:100%;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family: ui-sans-serif, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing:antialiased;
}

/* ===================== App shell: sidebar + contenido ===================== */
.app-shell{display:flex; min-height:100vh;}

.sidebar{
  width:270px; flex:0 0 270px; background:var(--sidebar-bg); border-right:1px solid var(--border);
  padding:1.5rem 1.25rem; display:flex; flex-direction:column; gap:1.5rem;
  position:sticky; top:0; height:100vh; overflow-y:auto;
}
.brand{display:flex; flex-direction:column; gap:.15rem;}
.eyebrow{font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); font-weight:700;}
h1{font-size:1.15rem; margin:0; font-weight:800; letter-spacing:-.01em; line-height:1.25;}

.side-nav{display:flex; flex-direction:column; gap:.35rem;}
.side-tab{
  display:flex; justify-content:space-between; align-items:center; gap:.5rem;
  border:none; background:transparent; color:var(--ink-soft); font-size:.86rem; font-weight:600;
  padding:.6rem .7rem; border-radius:10px; cursor:pointer; text-align:left;
}
.side-tab:hover{background:var(--neutral-soft); color:var(--ink);}
.side-tab.active{background:var(--accent-soft); color:var(--accent);}
.side-tab-count{font-size:.74rem; font-variant-numeric:tabular-nums; font-weight:700;}

.side-section{display:flex; flex-direction:column; gap:.9rem; padding-top:1rem; border-top:1px solid var(--border);}
.side-controls.hidden{display:none;}

.side-filter-group{display:flex; flex-direction:column; gap:.4rem;}
.side-filter-label{font-size:.7rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); font-weight:700;}
.chip-set-vertical{display:flex; flex-direction:column; gap:.3rem;}
.chip-set-vertical .chip{width:100%; text-align:left;}

.content{flex:1 1 auto; min-width:0; padding:1.75rem 2rem 3rem; max-width:980px;}
/* La tabla de Márgenes gana columnas por cada tarifa (2 fijas + 3 por tarifa) — con el ancho
   general de 980px aparecía un scroll horizontal molesto. Aquí usa todo el ancho disponible en
   vez del límite pensado para las tarjetas de las demás pestañas. */
.content:has(#tab-margenes:not(.hidden)){max-width:none;}
.content-header{display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-bottom:1.25rem;}
.content-header h2{font-size:1.4rem; margin:0 0 .2rem; font-weight:800; letter-spacing:-.01em;}
.count{color:var(--ink-soft); font-size:.82rem;}

.btn-small{padding:.45rem .9rem; font-size:.82rem;}

.tip-line{
  font-size:.85rem; color:var(--ink-soft); line-height:1.5; margin:0 0 1rem;
  padding:.75rem 1rem; background:var(--surface); border:1px solid var(--border); border-radius:10px;
}

.switch-wrap{display:flex; align-items:center; gap:.5rem; font-size:.82rem; color:var(--ink-soft); cursor:pointer; user-select:none;}
.switch-wrap input{position:absolute; opacity:0; width:0; height:0;}
.switch-track{width:38px; height:22px; border-radius:999px; background:var(--neutral-soft); border:1px solid var(--border); position:relative; transition:background .15s;}
.switch-thumb{position:absolute; top:1px; left:1px; width:18px; height:18px; border-radius:50%; background:var(--ink-soft); transition:transform .15s, background .15s;}
.switch-wrap input:checked + .switch-track{background:var(--warn-soft); border-color:var(--warn);}
.switch-wrap input:checked + .switch-track .switch-thumb{transform:translateX(16px); background:var(--warn);}

.btn-ghost{
  border:1px solid var(--border); background:var(--surface); color:var(--ink);
  padding:.5rem 1rem; border-radius:10px; font-size:.85rem; cursor:pointer; text-decoration:none;
  display:inline-block; text-align:center;
}
.btn-ghost:hover{border-color:var(--accent);}
.btn-primary{
  border:none; background:var(--accent); color:#fff; padding:.6rem 1.2rem; border-radius:10px;
  font-size:.9rem; font-weight:700; cursor:pointer;
}
.btn-primary:hover{filter:brightness(1.08);}

.tab-panel.hidden{display:none;}

.kpis{display:grid; grid-template-columns:repeat(auto-fit, minmax(140px,1fr)); gap:.65rem; margin-bottom:1.25rem;}
.kpi{background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:.75rem .9rem; box-shadow:var(--shadow);}
.kpi .label{font-size:.7rem; color:var(--ink-soft);}
.kpi .value{font-size:1.2rem; font-weight:800; font-variant-numeric:tabular-nums;}

.advanced-settings{font-size:.82rem;}
.advanced-settings summary{
  cursor:pointer; color:var(--ink-soft); padding:.3rem 0; list-style:none; display:inline-flex; align-items:center; gap:.35rem;
  font-size:.78rem; font-weight:600;
}
.advanced-settings summary::-webkit-details-marker{display:none;}
.advanced-settings summary::before{content:"▸"; color:var(--accent); transition:transform .15s; font-size:.7rem;}
.advanced-settings[open] summary::before{transform:rotate(90deg);}
.advanced-settings-body{display:flex; flex-direction:column; gap:.9rem; padding:.6rem 0 0;}
.search{
  padding:.55rem .75rem; border-radius:10px;
  border:1px solid var(--border); background:var(--surface); color:var(--ink); font-size:.86rem; width:100%;
}
.search:focus{outline:2px solid var(--accent); outline-offset:1px;}
.threshold-wrap{display:flex; flex-direction:column; align-items:flex-start; gap:.35rem; font-size:.78rem; color:var(--ink-soft);}
.threshold-wrap input[type="range"]{width:100%;}
.margen-wrap{display:flex; align-items:center; flex-wrap:wrap; gap:.4rem; font-size:.78rem; color:var(--ink-soft);}
.margen-wrap input{
  width:64px; padding:.35rem .5rem; border-radius:8px; border:1px solid var(--border);
  background:var(--surface); color:var(--ink); font-size:.85rem; font-variant-numeric:tabular-nums;
}
.margen-wrap input:focus{outline:2px solid var(--accent); outline-offset:1px;}

.chip-set{display:flex; gap:.4rem; flex-wrap:wrap;}
.chip-set .chip{
  border:1px solid var(--border); background:var(--surface); color:var(--ink-soft);
  padding:.4rem .65rem; border-radius:8px; font-size:.78rem; cursor:pointer;
  transition:background .15s, color .15s, border-color .15s;
}
.chip-set .chip:hover{border-color:var(--accent);}
.chip-set .chip.active{background:var(--accent-soft); color:var(--accent); border-color:var(--accent); font-weight:700;}
.pill-filter-active{
  border:1px solid var(--accent); background:var(--accent-soft); color:var(--accent);
  padding:.4rem .65rem; border-radius:8px; font-size:.76rem; font-weight:700; cursor:pointer; text-align:left;
}
.pill-filter-active.hidden{display:none;}

.queue{display:flex; flex-direction:column; gap:.9rem;}

/* ===================== Tarjetas ===================== */
.card{
  display:grid; grid-template-columns:210px 1fr; gap:1.25rem;
  background:var(--surface); border:1px solid var(--border); border-radius:14px;
  padding:1.1rem 1.25rem; box-shadow:var(--shadow);
}
.card.sugerencia-fuerte{border-color:var(--accent);}
.card.sospechoso{border-color:var(--warn);}

.card-left{display:flex; flex-direction:column; gap:.3rem; border-right:1px solid var(--border); padding-right:1.25rem;}
.badge-tipo{
  align-self:flex-start; font-size:.68rem; text-transform:uppercase; letter-spacing:.04em;
  padding:.15rem .5rem; border-radius:999px; background:var(--neutral-soft); color:var(--ink-soft); font-weight:700;
}
.badge-tipo.fuerte{background:var(--accent-soft); color:var(--accent);}
.fs-codart{font-size:.74rem; color:var(--ink-soft); font-variant-numeric:tabular-nums;}
.fs-desart{font-weight:700; font-size:.95rem; line-height:1.3;}
.fs-meta-row{display:flex; flex-wrap:wrap; gap:.5rem; align-items:center;}
.fs-coste, .fs-refart{font-size:.82rem; color:var(--ink-soft); font-variant-numeric:tabular-nums;}
.fs-stock{
  font-size:.7rem; font-weight:700; padding:.1rem .45rem; border-radius:999px;
  background:var(--neutral-soft); color:var(--ink-soft); font-variant-numeric:tabular-nums; white-space:nowrap;
}
.fs-stock.sin-stock{background:var(--warn-soft); color:var(--warn);}
.fs-margen{font-size:.74rem; color:var(--ink-soft); font-variant-numeric:tabular-nums; font-style:italic;}
.fs-refart-actual{font-size:.74rem; color:var(--ink-soft);}

.card-tarifas{display:flex; flex-direction:column; gap:.2rem; margin-top:.2rem;}
.card-tarifas:empty{display:none;}
.card-tarifa-row{
  display:flex; align-items:center; gap:.4rem; font-size:.74rem; color:var(--ink-soft);
  font-variant-numeric:tabular-nums;
}
.card-tarifa-row .btn-editar-tarifa{
  border:none; background:transparent; color:var(--accent); font-size:.72rem; font-weight:700;
  cursor:pointer; padding:0; text-decoration:underline;
}

.card-right{display:flex; flex-direction:column; gap:.6rem;}

/* Candidato principal: destacado, es la apuesta recomendada */
.candidato-hero{
  display:grid; grid-template-columns:56px 1fr auto; align-items:center; gap:1rem;
  padding:.85rem 1rem; border:1.5px solid var(--accent); border-radius:12px; background:var(--accent-soft);
}
.cand-img{width:56px; height:56px; border-radius:9px; overflow:hidden; background:var(--neutral-soft); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.cand-img img{width:100%; height:100%; object-fit:cover;}
.cand-score-badge{
  display:inline-block; font-size:.68rem; font-weight:800; padding:.1rem .5rem; border-radius:999px;
  background:var(--accent); color:#fff; margin-bottom:.3rem; font-variant-numeric:tabular-nums;
}
.cand-nombre{font-size:.95rem; font-weight:700;}
.cand-meta{font-size:.78rem; color:var(--ink-soft); font-variant-numeric:tabular-nums; margin-top:.1rem;}
.btn-accept-hero{
  border:none; background:var(--accent); color:#fff; font-weight:700;
  padding:.55rem 1.1rem; border-radius:9px; cursor:pointer; font-size:.85rem; white-space:nowrap;
}
.btn-accept-hero:hover{filter:brightness(1.1);}

/* Alternativas: plegadas por defecto, para no competir visualmente con la principal */
.alternativas{font-size:.82rem;}
.alternativas summary{
  cursor:pointer; color:var(--ink-soft); padding:.3rem 0; list-style:none;
  display:inline-flex; align-items:center; gap:.35rem; font-size:.78rem; font-weight:600;
}
.alternativas summary::-webkit-details-marker{display:none;}
.alternativas summary::before{content:"▸"; color:var(--ink-soft); transition:transform .15s; font-size:.7rem;}
.alternativas[open] summary::before{transform:rotate(90deg);}
.alt-list{display:flex; flex-direction:column; gap:.4rem; padding-top:.6rem;}
.candidato-alt{
  display:grid; grid-template-columns:36px 1fr auto auto; align-items:center; gap:.65rem;
  padding:.45rem .55rem; border:1px solid var(--border); border-radius:9px; background:var(--surface-2);
}
.cand-img-sm{width:36px; height:36px; border-radius:7px;}
.candidato-alt .cand-nombre{font-size:.82rem; font-weight:600;}
.candidato-alt .cand-meta{font-size:.72rem;}
.cand-score{font-size:.76rem; font-weight:700; font-variant-numeric:tabular-nums;}
.cand-score.alta{color:var(--accent);}
.cand-score.media{color:var(--warn);}
.cand-score.baja{color:var(--ink-soft);}
.btn-accept{
  border:none; background:var(--accent-soft); color:var(--accent); font-weight:700;
  padding:.35rem .75rem; border-radius:8px; cursor:pointer; font-size:.78rem;
}
.btn-accept:hover{background:var(--accent); color:#fff;}

.card-actions{display:flex; gap:.6rem; margin-top:.2rem;}
.btn-none, .btn-skip{
  border:1px solid var(--border); background:transparent; color:var(--ink-soft);
  padding:.4rem .8rem; border-radius:8px; cursor:pointer; font-size:.78rem;
}
.btn-none:hover{border-color:var(--danger); color:var(--danger);}
.btn-skip:hover{border-color:var(--ink-soft); color:var(--ink);}

.aviso-sospechoso{font-size:.72rem; color:var(--warn); margin:.5rem 0 0; line-height:1.4;}

.empty-state{text-align:center; padding:3rem 1rem; color:var(--ink-soft);}

/* ===================== Tarjeta de precio ===================== */
.card-precio{grid-template-columns:210px 1fr; align-items:center;}
.card-right-precio{display:flex; align-items:center; justify-content:space-between; gap:1.5rem; flex-wrap:wrap;}
.card-imagen{grid-template-columns:210px 1fr; align-items:center;}
.card-right-imagen{display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;}
.card-right-imagen .ia-imagen-link{margin:0;}
.card-right-imagen .sin-referencia-note{margin:0; flex:1 1 220px;}
.precio-compare{display:flex; align-items:center; gap:1.25rem;}
.precio-label{font-size:.7rem; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); font-weight:700;}
.precio-valor{font-size:1.15rem; font-weight:800; font-variant-numeric:tabular-nums; margin-top:.2rem;}
.precio-valor-nueva{color:var(--accent);}
.precio-arrow{color:var(--accent); font-size:1.2rem;}

/* ===================== Modales ===================== */
.modal-backdrop{
  display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:20;
  align-items:center; justify-content:center; padding:1rem;
}
.modal-backdrop.open{display:flex;}
.modal{
  background:var(--surface); border-radius:16px; padding:1.5rem; max-width:420px; width:100%;
  box-shadow:var(--shadow); border:1px solid var(--border);
}
.modal-wide{max-width:640px;}
.modal h2{margin:0 0 1rem; font-size:1.1rem;}
.diff-row{display:grid; grid-template-columns:80px 1fr auto 1fr; align-items:center; gap:.5rem; padding:.4rem 0; font-size:.88rem;}
.diff-label{font-weight:700; color:var(--ink-soft); font-size:.74rem; text-transform:uppercase;}
.diff-before{color:var(--ink-soft); text-align:right; font-variant-numeric:tabular-nums;}
.diff-arrow{color:var(--accent); text-align:center;}
.diff-after{font-weight:700; font-variant-numeric:tabular-nums;}
.modal-note{font-size:.8rem; color:var(--ink-soft); margin:.75rem 0 0; padding:.6rem .75rem; background:var(--neutral-soft); border-radius:8px;}
.modal-note.margin-note{background:var(--accent-soft); color:var(--ink);}
.modal-actions{display:flex; justify-content:flex-end; gap:.6rem; margin-top:1.25rem;}

.cm-margen-real-badge{
  font-size:.85rem; color:var(--ink-soft); background:var(--neutral-soft); border-radius:8px;
  padding:.5rem .75rem; margin:.75rem 0;
}
.cm-margen-real-badge strong{color:var(--ink); font-variant-numeric:tabular-nums;}
.cm-margen-real-badge strong.desfasado{color:var(--warn);}
.cm-field-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:.75rem; margin-top:.5rem;}
.cm-field{display:flex; flex-direction:column; gap:.25rem;}
.cm-field label{font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft);}
.cm-field-input{display:flex; align-items:center; gap:.3rem; font-variant-numeric:tabular-nums;}
.cm-field-input input{width:100%; min-width:0;}
.cm-field-antes{font-size:.72rem; color:var(--ink-soft); font-variant-numeric:tabular-nums;}
.cm-hint{font-size:.76rem; color:var(--ink-soft); margin:.5rem 0 0;}
@media (max-width:520px){
  .cm-field-grid{grid-template-columns:1fr;}
}

.nombre-toggle-wrap{
  display:flex; align-items:center; gap:.5rem; font-size:.84rem; color:var(--ink);
  margin-top:.9rem; cursor:pointer; user-select:none;
}
.nombre-toggle-wrap input{width:16px; height:16px; accent-color:var(--accent); cursor:pointer;}
.diff-row-nombre.hidden{display:none;}

.pvp-rows{margin-top:.5rem; display:flex; flex-direction:column; gap:.3rem;}
.pvp-rows.hidden{display:none;}
.pvp-row{
  display:flex; justify-content:space-between; align-items:center; gap:.5rem;
  font-size:.8rem; padding:.35rem .6rem; background:var(--neutral-soft); border-radius:8px;
}
.pvp-row .pvp-tarifa{color:var(--ink-soft); font-weight:600;}
.pvp-row .pvp-valores{font-variant-numeric:tabular-nums; font-weight:700;}
.pvp-row.pvp-error{background:var(--warn-soft); color:var(--warn);}
.pvp-origen{color:var(--ink-soft); font-weight:400; font-size:.72rem;}

.pvp-section-label{display:block; margin-top:.9rem;}
.pvp-row-edit{
  display:flex; align-items:center; gap:.5rem; flex-wrap:wrap;
  font-size:.8rem; padding:.35rem .6rem; background:var(--neutral-soft); border-radius:8px;
}
.pvp-row-edit.pvp-row-negativo{background:var(--warn-soft); color:var(--warn);}
.pvp-row-check-wrap{display:flex; align-items:center; gap:.35rem; cursor:pointer; user-select:none;}
.pvp-row-check-wrap input{width:16px; height:16px; accent-color:var(--accent); cursor:pointer;}
.pvp-row-input{width:90px; font-variant-numeric:tabular-nums;}
.pvp-row-margen{font-weight:600; font-size:.72rem; color:var(--good); white-space:nowrap;}
.pvp-row-warning{font-weight:600; font-size:.72rem;}
.pvp-row-warning.hidden{display:none;}

.margin-table-wrap{border:1px solid var(--border); border-radius:14px; overflow:auto; background:var(--surface); box-shadow:var(--shadow); max-height:72vh;}
.margin-table{width:100%; border-collapse:collapse; font-size:.8rem;}
.margin-table th{
  position:sticky; top:0; background:var(--surface-2); text-align:left; padding:.5rem .55rem;
  font-size:.68rem; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft); border-bottom:1px solid var(--border);
}
.margin-table th.num, .margin-table td.num{text-align:right; font-variant-numeric:tabular-nums;}
.margin-table td{padding:.45rem .55rem; border-bottom:1px solid var(--border); vertical-align:middle; white-space:nowrap;}
.margin-table td:first-child{white-space:normal; max-width:220px;}
.margin-table tr:last-child td{border-bottom:none;}
.margin-table tr:hover td{background:var(--neutral-soft);}
.mg-desart{font-weight:600;}
.mg-codart{font-size:.72rem; color:var(--ink-soft);}
.mg-margen-real.desfasado{color:var(--warn); font-weight:700;}

.margin-table th[data-sort]{cursor:pointer; user-select:none; white-space:nowrap;}
.margin-table th[data-sort]:hover{color:var(--ink);}
.margin-table th .sort-arrow{margin-left:.25rem; opacity:.5;}
.margin-table th.sort-activo .sort-arrow{opacity:1;}
.mg-tarifa-group-label{
  font-size:.7rem; font-weight:700; color:var(--ink-soft); text-transform:none;
  letter-spacing:0; display:block; margin-bottom:.15rem;
}
.mg-editar-cell{white-space:nowrap;}
.mg-sin-tarifa{color:var(--ink-soft); font-style:italic;}

.price-diff{
  display:inline-flex; align-items:center; font-size:.72rem; font-weight:700;
  padding:.1rem .45rem; border-radius:999px; margin-left:.35rem; font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.price-diff.down{background:var(--good-soft); color:var(--good);}
.price-diff.up{background:var(--warn-soft); color:var(--warn);}
.price-diff.flat{background:var(--neutral-soft); color:var(--ink-soft);}

.conflict-compare{display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-top:.75rem;}
.conflict-option{border:1px solid var(--border); border-radius:10px; padding:.75rem; background:var(--surface-2);}
.conflict-option-nueva{border-color:var(--accent); background:var(--accent-soft);}
.conflict-label{font-size:.68rem; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); font-weight:700;}
.conflict-nombre{font-weight:700; font-size:.9rem; margin-top:.3rem;}
.conflict-meta{font-size:.78rem; color:var(--ink-soft); margin-top:.2rem; font-variant-numeric:tabular-nums;}

.manual-results{max-height:50vh; overflow-y:auto; margin-top:.75rem; display:flex; flex-direction:column; gap:.4rem;}
.manual-result-item{
  display:flex; justify-content:space-between; align-items:center; gap:.75rem;
  padding:.5rem .7rem; border:1px solid var(--border); border-radius:8px; font-size:.85rem;
}
.manual-result-item button{
  border:none; background:var(--accent-soft); color:var(--accent); font-weight:700;
  padding:.35rem .75rem; border-radius:8px; cursor:pointer; font-size:.78rem;
}

.seo-panel{
  border:1px solid var(--border); border-radius:14px; background:var(--surface); box-shadow:var(--shadow);
  padding:1.1rem 1.25rem; display:flex; flex-direction:column; gap:1rem;
}
.seo-header{display:flex; justify-content:space-between; align-items:center; gap:.75rem;}
.seo-compare{display:grid; grid-template-columns:1fr 1fr; gap:1.25rem;}
.seo-col{display:flex; flex-direction:column; gap:.35rem;}
.seo-col-label{font-size:.68rem; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); font-weight:700; margin-top:.5rem;}
.char-counter{font-weight:400; text-transform:none; letter-spacing:0; color:var(--ink-soft);}
.char-counter.char-counter-excedido{color:var(--danger); font-weight:700;}
.seo-col-label:first-child{margin-top:0;}
.seo-actual-nombre{font-weight:700; font-size:.92rem;}
.seo-actual-desc{font-size:.85rem; color:var(--ink-soft); line-height:1.5; white-space:pre-wrap;}
.seo-textarea{
  width:100%; border:1px solid var(--border); border-radius:8px; background:var(--surface-2); color:var(--ink);
  font-family:inherit; font-size:.85rem; line-height:1.5; padding:.5rem .6rem; resize:vertical;
}
.seo-textarea-nombre{font-weight:700; resize:none;}
.ia-section{display:flex; flex-direction:column; gap:.3rem; margin:.5rem 0 .75rem; padding:.75rem; border:1px solid var(--border); border-radius:10px; background:var(--surface-2);}
.ia-desc-original{max-height:120px; overflow-y:auto; padding:.5rem .6rem; border:1px solid var(--border); border-radius:8px; background:var(--surface);}
.ia-imagen-link{
  display:flex; align-items:center; gap:.6rem; margin:.4rem 0; padding:.4rem .6rem; border-radius:8px;
  border:1px solid var(--border); background:var(--accent-soft); color:var(--accent); font-size:.8rem; font-weight:600; text-decoration:none; width:fit-content;
}
.ia-imagen-link:hover{border-color:var(--accent);}
.ia-imagen-link img{width:36px; height:36px; object-fit:cover; border-radius:6px; background:var(--neutral-soft);}
@media (max-width:720px){
  .seo-compare{grid-template-columns:1fr;}
}

@media (max-width:900px){
  .app-shell{flex-direction:column;}
  .sidebar{width:100%; flex:none; position:relative; height:auto; border-right:none; border-bottom:1px solid var(--border);}
  .content{max-width:100%;}
}
@media (max-width:720px){
  .card{grid-template-columns:1fr;}
  .card-left{border-right:none; border-bottom:1px solid var(--border); padding-right:0; padding-bottom:.75rem;}
  .candidato-hero{grid-template-columns:48px 1fr; grid-template-areas:"img info" "btn btn";}
}
@media (prefers-reduced-motion: reduce){ *{transition:none !important;} }
