/* ==========================================================================
   Dicofar CRM · Estilos de vista: Blog (listado de entradas y editor)
   js/views/blog-entradas.js  ·  js/views/blog-editor.js
   Solo tokens de crm.css. Sin degradés decorativos. Móvil primero en los
   bloques @media del final.
   ========================================================================== */

/* 1. LISTADO DE ENTRADAS ------------------------------------------------- */
.posts-tabs { margin-bottom: var(--sp-4); }
.posts-toolbar .posts-search { flex: 1 1 280px; max-width: 420px; }
.posts-toolbar .posts-filter { width: auto; min-width: 190px; max-width: 260px; }
.posts-table .pt-thumb { width: 80px; padding-right: 0; }
.posts-table td.pt-title { min-width: 220px; max-width: 400px; }
.posts-table .th-ico { width: 15px; height: 15px; opacity: 1 !important; color: var(--text-3) !important; }
.pt-actions__in { display: inline-flex; align-items: center; gap: 2px; }
.posts-table .pt-author .person__name { max-width: 116px; }
.posts-table .pt-cat, .posts-table .pt-author { white-space: nowrap; }
.posts-table .pt-date, .posts-table .pt-status { white-space: nowrap; }
.posts-table .pt-num { width: 1%; }
.posts-table td { vertical-align: middle; }
.post-thumb {
  display: grid; place-items: center; width: 64px; height: 48px; border-radius: var(--radius-sm); overflow: hidden; flex: none;
  background: color-mix(in srgb, var(--c, var(--text-4)) 16%, var(--surface)); color: color-mix(in srgb, var(--c, var(--text-4)) 70%, var(--text));
}
.post-thumb img { width: 100%; height: 100%; object-fit: cover; }
.post-thumb .icon { width: 18px; height: 18px; }
.pt-link { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--text); font-weight: var(--fw-medium); line-height: 1.35; }
.pt-link:hover { color: var(--link); text-decoration: none; }
.pt-slug { display: block; max-width: 330px; margin-top: 2px; font-family: var(--mono); font-size: var(--fs-12); font-weight: var(--fw-regular); color: var(--text-3); min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.pt-featured-tag { display: inline-flex; align-items: center; gap: 3px; font-family: var(--font); color: var(--warning-text); font-weight: var(--fw-medium); flex: none; }
.pt-featured-tag .icon { fill: currentColor; }
.pt-mobile-meta { display: none; }
.cat-label { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; color: var(--text-2); }
.posts-table .table__sub { display: block; }
.pt-metric { display: inline-flex; align-items: center; gap: 4px; }
.pt-metric__icon { display: none; color: var(--text-4); }
.pt-pending {
  display: inline-grid; place-items: center; margin-left: 6px; min-width: 22px; height: 18px; padding: 0 5px; border-radius: var(--radius-full);
  background: var(--amber-bg); color: var(--amber-fg); font-size: 11px; font-weight: var(--fw-semibold); text-decoration: none !important; vertical-align: middle;
}
.star-btn { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: var(--radius); color: var(--text-4); transition: color var(--dur-1), background var(--dur-1); }
.star-btn:hover { background: var(--hover); color: var(--text-2); }
.star-btn[aria-pressed="true"] { color: var(--warning); }
.star-btn[aria-pressed="true"] .icon { fill: currentColor; }
.star-btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.posts-kpis .kpi__meta a { font-weight: var(--fw-medium); }

/* 2. MODO EDITOR (pantalla enfocada) -------------------------------------- */
.df-editor-mode .sidebar, .df-editor-mode .topbar, .df-editor-mode .tabbar, .df-editor-mode .skip-link { display: none !important; }
.df-editor-mode .app__col, .df-editor-mode .app[data-sidebar="collapsed"] .app__col { margin-left: 0 !important; padding-bottom: 0 !important; }
.df-editor-mode .toasts:not(.toasts--top) { bottom: calc(var(--sp-5) + var(--safe-bottom)); }
.ed { min-height: 100vh; min-height: 100dvh; background: var(--surface); --ed-bar-h: 56px; }

/* Barra superior */
.ed-bar {
  position: sticky; top: 0; z-index: var(--z-topbar); display: flex; align-items: center; gap: var(--sp-3); height: calc(var(--ed-bar-h) + var(--safe-top));
  padding: var(--safe-top) calc(var(--sp-4) + var(--safe-right)) 0 calc(var(--sp-3) + var(--safe-left));
  background: color-mix(in srgb, var(--surface) 94%, transparent); border-bottom: 1px solid var(--border);
  backdrop-filter: saturate(1.4) blur(8px); -webkit-backdrop-filter: saturate(1.4) blur(8px);
}
.ed-bar__start { display: flex; align-items: center; gap: var(--sp-2); flex: 1 1 auto; min-width: 0; }
.ed-bar__back { padding: 0 10px; }
.ed-bar__sep { width: 1px; height: 20px; background: var(--border); flex: none; }
.ed-bar__status { flex: none; display: inline-flex; }
.ed-save { display: inline-flex; align-items: center; gap: 6px; min-width: 0; font-size: var(--fs-13); color: var(--text-3); white-space: nowrap; overflow: hidden; }
.ed-save > span:not(.ed-save__dot) { overflow: hidden; text-overflow: ellipsis; }
.ed-save .icon { color: var(--success-text); }
.ed-save__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--warning); flex: none; }
.ed-save__err { display: inline-flex; align-items: center; gap: 4px; }
.ed-save__err .icon { color: inherit; }
.ed-bar__tools { display: flex; align-items: center; gap: 2px; flex: none; }
.ed-bar__end { display: flex; align-items: center; gap: var(--sp-2); flex: none; }
.ed-redo .icon, .ed-dbtn--redo .icon { transform: scaleX(-1); }
.ed-bar__primary { min-width: 104px; }

/* Distribución */
.ed-layout { display: grid; grid-template-columns: minmax(0, 1fr) 368px; align-items: start; }
.ed.is-panel-hidden .ed-layout { grid-template-columns: minmax(0, 1fr); }
.ed.is-panel-hidden .ed-panel { display: none; }
.ed-main { min-width: 0; }
.ed-canvas { position: relative; max-width: 768px; margin: 0 auto; padding: var(--sp-10) var(--sp-8) 160px; }
.ed-banner { margin-bottom: var(--sp-5); align-items: center; }
.ed-banner__actions { flex: none; }

/* Portada */
.ed-cover { margin-bottom: var(--sp-6); }
.ed-cover__drop {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--sp-2); min-height: 200px; padding: var(--sp-6);
  border: 1.5px dashed var(--border-strong); border-radius: var(--radius); background: var(--surface-2); text-align: center;
  transition: border-color var(--dur-1), background var(--dur-1);
}
.ed-cover.is-over .ed-cover__drop, .ed-cover.is-over .ed-cover__fig { border-color: var(--brand); background: var(--brand-soft); outline: 2px dashed var(--brand); outline-offset: 4px; }
.ed-cover__icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: var(--radius-lg); background: var(--surface); color: var(--text-3); box-shadow: inset 0 0 0 1px var(--border); }
.ed-cover__title { font-size: var(--fs-16); font-weight: var(--fw-semibold); color: var(--text); margin-top: var(--sp-1); }
.ed-cover__hint { font-size: var(--fs-13); color: var(--text-3); max-width: 420px; }
.ed-cover__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sp-2); margin-top: var(--sp-2); }
.ed-cover__busy { display: flex; align-items: center; justify-content: center; gap: var(--sp-3); min-height: 200px; border-radius: var(--radius); background: var(--surface-2); color: var(--text-3); font-size: var(--fs-13); }
.ed-cover__fig { position: relative; margin: 0; aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; background: var(--surface-3); }
.ed-cover__fig img { width: 100%; height: 100%; object-fit: cover; }
.ed-cover__actions { position: absolute; top: var(--sp-3); right: var(--sp-3); display: flex; gap: var(--sp-2); opacity: 0; transition: opacity var(--dur-2) var(--ease); }
.ed-cover__fig:hover .ed-cover__actions, .ed-cover__fig:focus-within .ed-cover__actions { opacity: 1; }
.ed-cover__alt { margin-top: var(--sp-3); display: flex; flex-direction: column; gap: 6px; }
.ed-cover__warn { display: flex; align-items: flex-start; gap: 6px; font-size: var(--fs-12); color: var(--warning-text); }
.ed-cover__warn .icon { margin-top: 1px; }
.is-attention { border-color: var(--warning) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--warning) 25%, transparent) !important; }

/* Título y extracto */
.ed-title, .ed-excerpt { display: block; width: 100%; border: 0; padding: 0; background: transparent; resize: none; overflow: hidden; color: var(--text); outline: none; font-family: var(--font); }
.ed-title { font-size: 38px; line-height: 46px; font-weight: var(--fw-semibold); letter-spacing: -.02em; margin: 0 0 var(--sp-3); }
.ed-excerpt { font-size: 19px; line-height: 29px; color: var(--text-2); margin-bottom: var(--sp-8); }
.ed-title::placeholder, .ed-excerpt::placeholder { color: var(--text-4); opacity: 1; }
.ed-title:focus-visible, .ed-excerpt:focus-visible { box-shadow: -12px 0 0 -10px var(--brand); }

/* Contenido */
.ed-content { position: relative; min-height: 320px; font-size: 17px; line-height: 1.72; color: var(--text); outline: none; caret-color: var(--brand); overflow-wrap: break-word; }
.ed-content.is-dragover { outline: 2px dashed var(--brand); outline-offset: 10px; border-radius: var(--radius); }
.ed-content > * { margin: 0 0 1em; }
.ed-content > :last-child { margin-bottom: 0; }
.ed-content h2 { font-size: 27px; line-height: 1.3; font-weight: var(--fw-semibold); letter-spacing: -.01em; margin: 1.8em 0 .55em; }
.ed-content h3 { font-size: 21px; line-height: 1.35; font-weight: var(--fw-semibold); margin: 1.5em 0 .45em; }
.ed-content > h2:first-child, .ed-content > h3:first-child { margin-top: 0; }
.ed-content ul, .ed-content ol { padding-left: 1.6em; }
.ed-content ul { list-style: disc; } .ed-content ol { list-style: decimal; }
.ed-content li { margin: .3em 0; padding-left: .2em; }
.ed-content li > ul, .ed-content li > ol { margin: .3em 0; }
.ed-content blockquote { padding: 2px 0 2px 22px; border-left: 3px solid var(--tofu); font-size: 1.15em; line-height: 1.55; color: var(--text-2); }
.ed-content blockquote p, .ed-content aside p { margin: 0 0 .6em; }
.ed-content blockquote p:last-child, .ed-content aside p:last-child { margin-bottom: 0; }
.ed-content aside.callout { padding: var(--sp-4) var(--sp-5); border-left: 3px solid var(--brand); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: var(--info-soft); font-size: 16px; line-height: 1.6; }
.ed-content aside.callout--warning { background: var(--warning-soft); border-left-color: var(--warning); }
.ed-content aside.callout--tip, .ed-content aside.callout--success { background: var(--tofu-soft); border-left-color: var(--tofu); }
.ed-content a { color: var(--link); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.ed-content code { font-family: var(--mono); font-size: .86em; padding: 1px 5px; border-radius: 3px; background: var(--surface-3); }
.ed-content pre { font-family: var(--mono); font-size: 14px; padding: var(--sp-4); border-radius: var(--radius-sm); background: var(--surface-3); white-space: pre-wrap; }
.ed-content mark { background: var(--amber-bg); color: inherit; font-weight: inherit; }
.ed-content hr { border: 0; height: 1px; background: var(--border-strong); margin: 2.2em 0; cursor: pointer; }
.ed-content table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.45; margin: 1.6em 0; }
.ed-content th, .ed-content td { border: 1px solid var(--border-strong); padding: 8px 10px; text-align: left; vertical-align: top; min-width: 60px; }
.ed-content th { background: var(--surface-2); font-weight: var(--fw-semibold); }
.ed-content figure { position: relative; margin: 1.8em 0; }
.ed-content figure[data-block] { cursor: pointer; }
.ed-content figure img { display: block; width: 100%; height: auto; border-radius: var(--radius-sm); background: var(--surface-3); }
.ed-content figcaption { margin-top: 8px; font-size: 13px; line-height: 1.5; color: var(--text-3); outline: none; cursor: text; min-height: 1.5em; }
.ed-content figcaption.is-empty::before { content: attr(data-ph); color: var(--text-4); pointer-events: none; }
.ed-content [data-block].is-selected, .ed-content hr.is-selected { outline: 2px solid var(--brand); outline-offset: 5px; border-radius: var(--radius-sm); }
.ed-content figure.is-missing-alt img { box-shadow: 0 0 0 2px var(--warning); }
.ed-fig-warn {
  position: absolute; top: 10px; left: 10px; z-index: 1; display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px; border-radius: var(--radius-full);
  background: var(--warning); color: #1b1300; font-size: 12px; font-weight: var(--fw-semibold); line-height: 1; cursor: pointer; user-select: none;
}
.ed-video { display: flex; align-items: center; gap: var(--sp-4); aspect-ratio: 16 / 9; padding: var(--sp-6); border-radius: var(--radius-sm); background: var(--navy); color: #e8edf7; user-select: none; }
.ed-video__play { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: rgba(255, 255, 255, .12); flex: none; }
.ed-video__meta { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: 14px; line-height: 1.4; }
.ed-video__meta span { font-family: var(--mono); font-size: 12px; color: #aab5cc; overflow-wrap: anywhere; }
.ed-content aside.is-cta { padding: var(--sp-5) var(--sp-6); border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border)); border-radius: var(--radius); background: var(--brand-soft); font-size: 16px; line-height: 1.55; cursor: pointer; }
.ed-content aside.is-cta p { margin: 0 0 var(--sp-2); }
.ed-content aside.is-cta p:last-child { margin: var(--sp-3) 0 0; }
.ed-content aside.is-cta a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 var(--sp-4); border-radius: var(--radius-sm); background: var(--brand); color: #fff; font-weight: var(--fw-medium); text-decoration: none; }
.ed-uploading { margin: 1.8em 0; }
.ed-upload { display: flex; align-items: center; justify-content: center; gap: var(--sp-3); min-height: 140px; border: 1.5px dashed var(--border-strong); border-radius: var(--radius-sm); background: var(--surface-2); color: var(--text-3); font-size: var(--fs-13); }
.ed-content > p.is-empty::before { content: attr(data-ph); float: left; height: 0; color: var(--text-4); pointer-events: none; }
.ed-foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); margin-top: var(--sp-10); padding-top: var(--sp-3); border-top: 1px solid var(--border); font-size: var(--fs-12); color: var(--text-3); font-variant-numeric: tabular-nums; }

/* 3. BARRAS FLOTANTES Y MENÚS DEL EDITOR --------------------------------- */
.ed-bubble, .ed-blockbar, .ed-linktip, .ed-menu {
  position: fixed; z-index: var(--z-dropdown); background: var(--surface-raised); color: var(--text); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow-3);
}
.ed-bubble, .ed-blockbar { display: flex; align-items: center; gap: 2px; padding: 3px; }
.ed-bubble[hidden], .ed-blockbar[hidden], .ed-linktip[hidden], .ed-menu[hidden], .ed-plus[hidden], .ed-dock[hidden] { display: none !important; }
.ed-tbtn { display: inline-grid; place-items: center; min-width: 32px; height: 32px; border-radius: var(--radius-sm); color: var(--text-2); }
.ed-tbtn:hover { background: var(--hover); color: var(--text); }
.ed-tbtn[aria-pressed="true"] { background: var(--brand-soft); color: var(--brand-text); }
.ed-tbtn:focus-visible { outline: 2px solid var(--border-focus); outline-offset: -2px; }
.ed-tbtn--text { display: inline-flex; gap: 6px; padding: 0 8px; font-size: var(--fs-13); font-weight: var(--fw-medium); }
.ed-tbtn.is-warn { color: var(--warning-text); background: var(--warning-soft); }
.ed-tsep { width: 1px; height: 20px; margin: 0 3px; background: var(--border); flex: none; }
.ed-bubble [data-blockonly][hidden] { display: none; }
.ed-blockbar__label { padding: 0 8px 0 6px; font-size: var(--fs-12); font-weight: var(--fw-medium); color: var(--text-3); white-space: nowrap; }
.ed-seg { padding: 2px; }
.ed-seg > button { min-height: 26px; padding: 0 8px; font-size: var(--fs-12); }
.ed-linktip { display: flex; align-items: center; gap: 4px; padding: 3px 4px 3px 10px; font-size: var(--fs-13); max-width: min(420px, calc(100vw - 16px)); }
.ed-linktip > .icon { color: var(--text-3); }
.ed-linktip__url { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 4px; }
.ed-plus {
  position: fixed; z-index: var(--z-sticky); display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%;
  border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-3); transition: color var(--dur-1), border-color var(--dur-1), transform var(--dur-2) var(--ease);
}
.ed-plus:hover { color: var(--brand-text); border-color: var(--brand); transform: rotate(90deg); }
.ed-menu { display: flex; flex-direction: column; width: 320px; max-height: min(400px, 60vh); overflow: hidden; }
.ed-menu__search { padding: var(--sp-2); border-bottom: 1px solid var(--border); }
.ed-menu__list { overflow-y: auto; padding: var(--sp-1); overscroll-behavior: contain; }
.ed-menu__group { padding: 8px 10px 4px; font-size: 11px; font-weight: var(--fw-semibold); letter-spacing: .05em; text-transform: uppercase; color: var(--text-3); }
.ed-menu__item { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 5px 8px; border-radius: var(--radius-sm); cursor: pointer; }
.ed-menu__item[aria-selected="true"] { background: var(--selected); }
[data-theme="dark"] .ed-menu__item[aria-selected="true"] { background: var(--active); }
.ed-menu__icon { display: grid; place-items: center; width: 32px; height: 32px; flex: none; border-radius: var(--radius-sm); border: 1px solid var(--border); background: var(--surface); color: var(--text-2); }
.ed-menu__text { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; line-height: 1.3; }
.ed-menu__label { font-size: var(--fs-14); font-weight: var(--fw-medium); }
.ed-menu__desc { font-size: var(--fs-12); color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ed-menu__md { flex: none; }
.ed-menu__empty { padding: var(--sp-4); font-size: var(--fs-13); color: var(--text-3); text-align: center; }
.ed-menu__foot { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 6px 10px; border-top: 1px solid var(--border); background: var(--surface-2); font-size: 11px; color: var(--text-3); }
.ed-linkpop { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-3); }
.ed-linkpop__results { display: flex; flex-direction: column; gap: 2px; max-height: 220px; overflow-y: auto; }
.ed-linkpop__results:empty { display: none; }
.ed-linkpop__item { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 4px 8px; border-radius: var(--radius-sm); text-align: left; color: var(--text); }
.ed-linkpop__item:hover, .ed-linkpop__item:focus-visible { background: var(--hover); outline: none; }
.ed-linkpop__item > .icon { color: var(--text-3); }
.ed-linkpop__text { display: flex; flex-direction: column; min-width: 0; font-size: var(--fs-13); line-height: 1.3; }
.ed-linkpop__sub { font-size: var(--fs-12); color: var(--text-3); }
.ed-linkpop__actions { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); margin-top: var(--sp-1); }
.ed-dock {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--z-tabbar); display: flex; align-items: center; gap: 2px; overflow-x: auto; scrollbar-width: none;
  padding: 4px calc(8px + var(--safe-right)) calc(4px + var(--safe-bottom)) calc(8px + var(--safe-left)); background: var(--surface); border-top: 1px solid var(--border); box-shadow: 0 -4px 14px rgba(14, 26, 51, .08);
}
.ed-dock::-webkit-scrollbar { display: none; }
.ed-dbtn { display: inline-grid; place-items: center; min-width: 44px; height: 44px; border-radius: var(--radius); color: var(--text-2); flex: none; }
.ed-dbtn .icon { width: 20px; height: 20px; }
.ed-dbtn[aria-pressed="true"] { background: var(--brand-soft); color: var(--brand-text); }
.ed-dbtn:disabled { opacity: .4; }
.ed-dbtn--done { margin-left: auto; padding: 0 var(--sp-3); font-weight: var(--fw-semibold); color: var(--brand-text); }

/* 4. PANEL LATERAL -------------------------------------------------------- */
.ed-panel {
  position: sticky; top: calc(var(--ed-bar-h) + var(--safe-top)); height: calc(100vh - var(--ed-bar-h) - var(--safe-top)); height: calc(100dvh - var(--ed-bar-h) - var(--safe-top));
  display: flex; flex-direction: column; border-left: 1px solid var(--border); background: var(--surface);
}
.ed-panel__head { display: none; }
.ed-panel__tabs { padding: 0 var(--sp-5); flex: none; background: var(--surface); }
.ed-panel__body { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding-bottom: var(--sp-8); }
.ed-scrim { display: none; }
.ed-sec { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-4) var(--sp-5); border-bottom: 1px solid var(--border); }
.ed-sec:last-child { border-bottom: 0; }
.ed-sec__title { font-size: var(--fs-13); font-weight: var(--fw-semibold); color: var(--text); }
.ed-sec__row { align-items: center; }
.ed-sec > .btn { align-self: flex-start; }
.serp-frame { overflow: hidden; }
.serp-frame > .serp { transform-origin: 0 0; }
.ed-sec .field__label { font-size: var(--fs-13); }
.ed-sec .input-affix .input { min-width: 0; font-family: var(--mono); font-size: var(--fs-13); }
.ed-url { display: flex; align-items: center; gap: 4px; min-width: 0; font-family: var(--mono); font-size: var(--fs-12); color: var(--text-3); }
.ed-count { display: flex; justify-content: space-between; gap: var(--sp-2); font-size: var(--fs-12); color: var(--text-3); }
.ed-pubstate { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-2); font-size: var(--fs-13); color: var(--text-2); }
.ed-when { display: flex; flex-direction: column; gap: 4px; margin-top: var(--sp-2); }
.ed-when__inputs { display: flex; gap: var(--sp-2); }
.ed-when__inputs .input[type="date"] { flex: 1 1 60%; }
.ed-when__inputs .input[type="time"] { flex: 1 1 40%; }
.ed-details { margin-top: var(--sp-1); }
.ed-details > summary { cursor: pointer; font-size: var(--fs-13); font-weight: var(--fw-medium); color: var(--link); min-height: 32px; display: flex; align-items: center; list-style: none; }
.ed-details > summary::-webkit-details-marker { display: none; }
.ed-details > summary::before { content: "›"; display: inline-block; margin-right: 6px; transition: transform var(--dur-2) var(--ease); }
.ed-details[open] > summary::before { transform: rotate(90deg); }
.ed-newcat { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-3); border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-2); }
.ed-swatches { display: flex; flex-wrap: wrap; gap: 6px; }
.ed-swatch { position: relative; display: inline-flex; }
.ed-swatch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ed-swatch span { width: 26px; height: 26px; border-radius: 50%; background: var(--c); cursor: pointer; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12); }
.ed-swatch input:checked + span { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--c); }
.ed-swatch input:focus-visible + span { outline: 2px solid var(--border-focus); outline-offset: 4px; }
.ed-pcover { display: flex; align-items: flex-start; gap: var(--sp-3); }
.ed-pcover img { width: 128px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius-sm); background: var(--surface-3); flex: none; }
.ed-pcover-empty { display: flex; align-items: center; justify-content: center; gap: var(--sp-2); width: 100%; min-height: 72px; border: 1.5px dashed var(--border-strong); border-radius: var(--radius); color: var(--text-2); font-size: var(--fs-13); font-weight: var(--fw-medium); }
.ed-pcover-empty:hover { border-color: var(--brand); color: var(--brand-text); background: var(--brand-soft); }
.ed-meta { display: grid; grid-template-columns: auto 1fr; gap: 4px var(--sp-3); font-size: var(--fs-12); }
.ed-meta dt { color: var(--text-3); }
.ed-meta dd { color: var(--text-2); min-width: 0; overflow-wrap: anywhere; }
.ed-chip { display: inline-grid; place-items: center; min-width: 26px; height: 18px; padding: 0 6px; border-radius: var(--radius-full); font-size: 11px; font-weight: var(--fw-semibold); font-variant-numeric: tabular-nums; background: var(--gray-bg); color: var(--gray-fg); }
.ed-chip:empty { display: none; }
.ed-chip--ok { background: var(--green-bg); color: var(--green-fg); }
.ed-chip--warn { background: var(--amber-bg); color: var(--amber-fg); }
.ed-chip--fail { background: var(--red-bg); color: var(--red-fg); }
.ed-scorecard { display: flex; align-items: center; gap: var(--sp-3); }
.ed-scorecard__title { font-size: var(--fs-14); font-weight: var(--fw-semibold); }
.ed-ring { flex: none; }
.ed-ring circle { fill: none; stroke-width: 6; }
.ed-ring__track { stroke: var(--surface-3); }
.ed-ring__bar { stroke-linecap: round; transition: stroke-dashoffset var(--dur-3) var(--ease); }
.ed-ring--ok .ed-ring__bar { stroke: var(--success); } .ed-ring--warn .ed-ring__bar { stroke: var(--warning); } .ed-ring--fail .ed-ring__bar { stroke: var(--danger); }
.ed-ring text { fill: var(--text); font-size: 16px; font-weight: var(--fw-semibold); font-family: var(--font); }
.ed-checks { display: flex; flex-direction: column; }
.ed-check { display: flex; align-items: flex-start; gap: var(--sp-2); padding: 7px 0; border-bottom: 1px solid var(--border); }
.ed-check:last-child { border-bottom: 0; }
.ed-check__icon { flex: none; margin-top: 1px; display: inline-flex; }
.ed-check--ok .ed-check__icon { color: var(--success-text); }
.ed-check--warn .ed-check__icon { color: var(--warning-text); }
.ed-check--fail .ed-check__icon { color: var(--danger-text); }
.ed-check--na .ed-check__icon { color: var(--text-4); }
.ed-check__body { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1 1 auto; }
.ed-check__label { font-size: var(--fs-13); font-weight: var(--fw-medium); color: var(--text); }
.ed-check__hint { font-size: var(--fs-12); line-height: 1.45; color: var(--text-3); }
.ed-check > .btn { flex: none; align-self: center; }
.ed-checks--compact .ed-check { padding: 5px 0; }
.ed-meter { height: 4px; margin-top: 6px; border-radius: var(--radius-full); background: var(--surface-3); overflow: hidden; }
.ed-meter > span { display: block; height: 100%; width: calc(var(--p, 0) * 1%); border-radius: inherit; background: var(--success); transition: width var(--dur-2) var(--ease); }
.ed-meter--warn > span { background: var(--warning); } .ed-meter--fail > span { background: var(--danger); }
.ed-meter__text { display: flex; justify-content: space-between; gap: var(--sp-2); margin-top: 4px; font-size: var(--fs-12); color: var(--text-3); font-variant-numeric: tabular-nums; }
.ed-meter--ok + .ed-meter__text .ed-meter__label { color: var(--success-text); }
.ed-meter--warn + .ed-meter__text .ed-meter__label { color: var(--warning-text); }
.ed-meter--fail + .ed-meter__text .ed-meter__label { color: var(--danger-text); }

/* Vista previa de Google (colores del buscador, claro y oscuro) */
.serp { --serp-bg: #fff; --serp-title: #1a0dab; --serp-text: #4d5156; --serp-name: #202124; --serp-muted: #70757a; --serp-fav: #f1f3f4;
  padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--serp-bg); font-family: Arial, Helvetica, sans-serif; overflow: hidden; }
[data-theme="dark"] .serp { --serp-bg: #202124; --serp-title: #99c3ff; --serp-text: #bdc1c6; --serp-name: #dadce0; --serp-muted: #9aa0a6; --serp-fav: #303134; }
.serp__site { display: flex; align-items: center; gap: 10px; min-width: 0; }
.serp__fav { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--serp-fav); flex: none; color: #0e1a33; }
[data-theme="dark"] .serp__fav { color: #e8eaed; }
.serp__mark { width: 13px; height: 15px; }
.serp__site-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.serp__name { font-size: 14px; color: var(--serp-name); }
.serp__url { font-size: 12px; color: var(--serp-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.serp__title { margin: 8px 0 3px; font-size: 20px; line-height: 1.3; color: var(--serp-title); overflow-wrap: anywhere; }
.serp--mobile .serp__title { font-size: 18px; }
.serp__desc { font-size: 14px; line-height: 1.58; color: var(--serp-text); overflow-wrap: anywhere; }
.serp__desc strong { font-weight: 700; color: inherit; }
.serp__date { color: var(--serp-muted); }
.serp--mobile { max-width: 360px; }
.social-card { border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; background: var(--surface-2); }
.social-card__img { aspect-ratio: 1.91 / 1; background: var(--surface-3); display: grid; place-items: center; color: var(--text-4); font-size: var(--fs-12); }
.social-card__img > span { display: inline-flex; align-items: center; gap: 6px; }
.social-card__img img { width: 100%; height: 100%; object-fit: cover; }
.social-card__body { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-top: 1px solid var(--border); }
.social-card__domain { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--text-3); }
.social-card__title { font-size: var(--fs-14); font-weight: var(--fw-semibold); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.social-card__desc { font-size: var(--fs-12); color: var(--text-3); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }

/* 5. "ANTES DE PUBLICAR" Y SELECTOR DE MEDIOS ------------------------------ */
.prepub { display: flex; flex-direction: column; }
.prepub__sec { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-4) 0; border-bottom: 1px solid var(--border); }
.prepub__sec:first-child { padding-top: 0; }
.prepub__sec:last-child { border-bottom: 0; }
.prepub__title { font-size: var(--fs-13); font-weight: var(--fw-semibold); }
.prepub-drawer .modal__footer .btn--primary { min-width: 160px; }
.media-picker .mp__tabs { margin-bottom: var(--sp-3); }
.media-picker .tab .icon { width: 15px; height: 15px; }
.mp__search { margin-bottom: var(--sp-3); }
.mp__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); gap: var(--sp-2); max-height: 300px; overflow-y: auto; padding: 3px; }
.mp__item { position: relative; aspect-ratio: 4 / 3; border-radius: var(--radius-sm); overflow: hidden; background: var(--surface-3); box-shadow: 0 0 0 1px var(--border); }
.mp__item img { width: 100%; height: 100%; object-fit: cover; }
.mp__item:hover { box-shadow: 0 0 0 2px var(--border-strong); }
.mp__item.is-selected { box-shadow: 0 0 0 3px var(--brand); }
.mp__item:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.mp__name { position: absolute; left: 0; right: 0; bottom: 0; padding: 3px 6px; background: rgba(14, 26, 51, .78); color: #fff; font-size: 11px; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; }
.mp__noalt { position: absolute; top: 5px; left: 5px; padding: 1px 6px; border-radius: var(--radius-full); background: var(--warning); color: #1b1300; font-size: 10px; font-weight: var(--fw-semibold); }
.mp__empty { grid-column: 1 / -1; }
.mp__drop {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--sp-2); min-height: 180px; padding: var(--sp-6); text-align: center; cursor: pointer;
  border: 1.5px dashed var(--border-strong); border-radius: var(--radius); background: var(--surface-2); transition: border-color var(--dur-1), background var(--dur-1);
}
.mp__drop:hover, .mp__drop.is-over, .mp__drop:focus-within { border-color: var(--brand); background: var(--brand-soft); }
.mp__drop-icon { color: var(--text-3); }
.mp__drop-title { font-weight: var(--fw-semibold); }
.mp__drop-hint { font-size: var(--fs-13); color: var(--text-3); }
.mp__progress { display: flex; align-items: center; gap: var(--sp-2); padding: var(--sp-3) 0; font-size: var(--fs-13); color: var(--text-3); }
[data-mp-up-status] .callout, [data-mp-up-status] .form-error { margin-top: var(--sp-3); }
.mp__details { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: var(--sp-4); margin-top: var(--sp-4); padding-top: var(--sp-4); border-top: 1px solid var(--border); }
.mp__preview img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius-sm); background: var(--surface-3); }

/* 6. RESPONSIVE ------------------------------------------------------------- */
/* Listado a 1280–1365 px: el slug no fija el ancho de la columna y el autor queda solo con su avatar,
   así la tabla entra sin scroll horizontal (antes se cortaban comentarios y acciones). */
.posts-table .pt-slug { width: 0; min-width: 100%; }
@media (max-width: 1365px) {
  .posts-table .pt-author .person__name { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (max-width: 1279px) {
  .ed-layout { grid-template-columns: minmax(0, 1fr) 336px; }
  .ed-canvas { padding-inline: var(--sp-6); }
}
@media (max-width: 1023px) {
  .ed-bar__tools { display: none; }
  .posts-table .pt-author .person__name { display: none; }
}
@media (max-width: 767px) {
  /* Listado: tarjetas */
  .posts-kpis .kpi { padding: var(--sp-3); }
  .posts-kpis .kpi__meta:not(.posts-kpis__keep) { display: none; }
  .posts-toolbar .posts-search { flex: 1 1 100%; max-width: none; }
  .posts-toolbar .posts-filter { flex: 1 1 calc(50% - 4px); min-width: 0; max-width: none; }
  .posts-toolbar [data-clear] { flex: 1 1 100%; }
  .posts-table-wrap { border-radius: var(--radius); }
  .posts-table.table--cards tr { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px var(--sp-3); padding: var(--sp-3) var(--sp-3) var(--sp-3) var(--sp-4); }
  .posts-table.table--cards td { display: block; width: auto; padding: 0 !important; text-align: left; }
  .posts-table.table--cards td::before { content: none !important; }
  .posts-table.table--cards td.pt-thumb { flex: 0 0 64px; }
  .posts-table.table--cards td.pt-title { flex: 1 1 calc(100% - 64px - 80px - 2 * var(--sp-3)); min-width: 0; max-width: none; padding: 0 !important; font-size: var(--fs-14); }
  .posts-table.table--cards td.pt-actions { flex: 0 0 auto; width: auto; margin: -6px -8px 0 0; }
  .posts-table.table--cards td.pt-actions .btn, .posts-table.table--cards td.pt-actions .star-btn { --btn-h: 40px; width: 40px; height: 40px; }
  .posts-table.table--cards td.pt-cat, .posts-table.table--cards td.pt-author, .posts-table.table--cards td.pt-status { display: none; }
  .posts-table.table--cards td.pt-num { order: 5; flex: none; font-size: var(--fs-13); color: var(--text-2); }
  .posts-table .pt-num + .pt-num { margin-left: var(--sp-2); }
  .posts-table.table--cards td.pt-views { margin-left: 76px; }
  .pt-metric__icon { display: inline-block; }
  .pt-mobile-meta { display: flex; align-items: center; gap: var(--sp-2); margin-top: 6px; font-size: var(--fs-12); font-weight: var(--fw-regular); color: var(--text-3); min-width: 0; }
  .pt-slug { display: none; }
  .post-thumb { width: 64px; height: 64px; }

  /* Editor */
  .ed { --ed-bar-h: 56px; }
  .ed-bar { gap: var(--sp-1); padding-left: calc(var(--sp-1) + var(--safe-left)); padding-right: calc(var(--sp-2) + var(--safe-right)); }
  .ed-bar__back { width: 44px; padding: 0; }
  .ed-bar__status .badge { height: 20px; padding: 0 6px; font-size: 11px; }
  .ed-save { font-size: var(--fs-12); flex: none; }
  .ed-save > span:not(.ed-save__dot):not(.ed-save__err) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .ed-save__err { font-size: 0; } .ed-save__err .icon { width: 16px; height: 16px; }
  .ed-save .spinner { width: 14px; height: 14px; }
  .ed-bar__end { gap: 2px; }
  .ed-bar__preview { width: 44px; padding: 0; }
  .ed-bar__primary { min-width: 0; padding: 0 var(--sp-3); }
  .ed-layout, .ed.is-panel-hidden .ed-layout { grid-template-columns: minmax(0, 1fr); }
  .ed-canvas { padding: var(--sp-5) calc(var(--sp-4) + var(--safe-right)) 140px calc(var(--sp-4) + var(--safe-left)); }
  .ed.has-dock .ed-canvas { padding-bottom: 200px; }
  .ed-cover__drop { min-height: 168px; padding: var(--sp-4); }
  .ed-cover__btns .btn { flex: 1 1 auto; }
  .ed-cover__actions { opacity: 1; top: var(--sp-2); right: var(--sp-2); }
  .ed-title { font-size: 27px; line-height: 35px; }
  .ed-excerpt { font-size: 17px; line-height: 26px; margin-bottom: var(--sp-6); }
  .ed-content { font-size: 17px; }
  .ed-content h2 { font-size: 23px; } .ed-content h3 { font-size: 19px; }
  .ed-content table { display: block; overflow-x: auto; }
  .ed-video { gap: var(--sp-3); padding: var(--sp-4); }
  .ed-video__play { width: 48px; height: 48px; }
  .ed-blockbar__label { display: none; }
  .ed-blockbar { max-width: calc(100vw - 16px); overflow-x: auto; }
  .ed-tbtn { min-width: 40px; height: 40px; }
  .ed-plus { display: none !important; }
  .ed-bubble { display: none !important; }
  .ed-menu.ed-menu--sheet { left: 0 !important; right: 0; top: auto !important; width: auto; max-height: 46vh; border-radius: 14px 14px 0 0; border-bottom: 0; }
  .ed-menu--sheet .ed-menu__foot { display: none; }
  /* Panel como hoja a pantalla completa */
  .ed-panel, .ed.is-panel-hidden .ed-panel {
    display: flex; position: fixed; inset: 0; top: 0; z-index: var(--z-drawer); height: 100%; border-left: 0; padding-top: var(--safe-top);
    transform: translateY(100%); visibility: hidden; transition: transform var(--dur-3) var(--ease), visibility 0s linear var(--dur-3);
  }
  .ed-panel.is-open { transform: none; visibility: visible; transition: transform var(--dur-3) var(--ease), visibility 0s; }
  .ed-panel__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); padding: var(--sp-2) var(--sp-2) 0 var(--sp-4); flex: none; }
  .ed-panel__title { font-size: var(--fs-16); font-weight: var(--fw-semibold); }
  .ed-panel__tabs { padding: 0 var(--sp-4); }
  .ed-panel__body { padding-bottom: calc(var(--sp-8) + var(--safe-bottom)); }
  .ed-sec { padding: var(--sp-4); }
  .ed-when__inputs .input { height: 44px; }
  .mp__details { grid-template-columns: minmax(0, 1fr); }
  .mp__preview { max-width: 240px; }
  .mp__grid { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); max-height: 42vh; }
  .ed-linkpop { width: auto; }
  /* URL del panel: 16 px para que iOS no haga zoom al enfocarla */
  .ed-sec .input-affix .input { font-size: var(--fs-16); }
  /* Barra de formato: "Listo" queda siempre visible aunque el resto se desplace (a 360-390 px se cortaba) */
  .ed-dbtn { min-width: 40px; }
  .ed-dbtn--done { position: sticky; right: 0; background: var(--surface); box-shadow: -10px 0 8px -6px var(--surface); }
}
@media (min-width: 768px) {
  .ed-dock { display: none !important; }
}
@media (hover: none) {
  .ed-cover__actions { opacity: 1; }
}
@media print {
  .ed-bar, .ed-panel, .ed-float, .ed-foot, .ed-cover__actions { display: none !important; }
}
[data-theme="dark"] .cat-label .dot { box-shadow: 0 0 0 1px rgba(255, 255, 255, .35); }