/* Hoja de pantalla de ops (el <style> de public/index.html) recortada a lo que usa Komandesk. */
.sidebar-link { cursor: pointer; display: flex; align-items: center; gap: 0.55rem; padding: 0.42rem 0.65rem; border-radius: 0.5rem; font-size: 0.82rem; color: var(--nav-fg); transition: background 0.15s, color 0.15s; }
.sidebar-link:hover { background: var(--nav-hover-bg); color: var(--nav-fg-strong); }
.sidebar-link.active { background: var(--nav-active-bg); color: var(--nav-active-fg); font-weight: 600; }
.sidebar-link.active:hover { background: var(--nav-active-bg); }
/* Sidebar collapse */
#sidebar { width: clamp(12rem, 11vw, 13.25rem); min-width: 12rem; max-width: 13.25rem; transition: width 200ms ease, min-width 200ms ease; background: var(--nav-bg); color: var(--nav-fg); border-color: var(--nav-border); }
#sidebar .sidebar-head { border-color: var(--nav-border); }
#sidebar.collapsed { width: 3.5rem !important; min-width: 3.5rem !important; max-width: 3.5rem !important; }
#sidebar-toggle { cursor: pointer; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 4px; color: var(--nav-muted); border: 1px solid transparent; background: transparent; font-size: 14px; line-height: 1; }
#sidebar-toggle:hover { background: var(--nav-hover-bg); color: var(--nav-fg-strong); }
#sidebar.collapsed .sidebar-label,
#sidebar.collapsed .sidebar-group-label,
#sidebar.collapsed .sidebar-group-caret,
#sidebar.collapsed .sidebar-brand { display: none; }
#sidebar.collapsed .sidebar-link { justify-content: center; padding: 0.5rem 0; font-weight: 600; }
.sidebar-icon { display: inline-flex; align-items: center; justify-content: center; width: 1.15rem; min-width: 1.15rem; height: 1.15rem; color: var(--nav-icon-fg); stroke: currentColor; stroke-width: 1.85; stroke-linecap: round; stroke-linejoin: round; fill: none; }
.sidebar-link:hover .sidebar-icon { color: var(--nav-fg-strong); }
.sidebar-link.active .sidebar-icon { color: var(--primary); }
#sidebar.collapsed .sidebar-head { justify-content: center; padding-left: 0; padding-right: 0; }
#sidebar.collapsed nav { padding-left: 0.25rem; padding-right: 0.25rem; }
#sidebar nav { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }
#sidebar nav::-webkit-scrollbar { width: 6px; }
#sidebar nav::-webkit-scrollbar-track { background: transparent; }
#sidebar nav::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 999px; }
#sidebar nav::-webkit-scrollbar-thumb:hover { background: var(--nav-muted); }
.brand-lockup { display: inline-flex; align-items: center; gap: 0.6rem; min-width: 0; }
.brand-mark { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: 0.48rem; background: var(--primary); color: var(--primary-fg); }
.brand-mark svg { width: 1.1rem; height: 1.1rem; stroke: currentColor; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; fill: none; }
.brand-word { color: var(--nav-fg-strong); letter-spacing: 0; white-space: nowrap; }
.brand-version { color: var(--nav-muted); font-size: 0.72rem; font-weight: 500; margin-left: 0.12rem; }
.sidebar-group { margin-top: 0.4rem; }
.sidebar-group:first-child { margin-top: 0; }
.sidebar-group-toggle { width: 100%; display: flex; align-items: center; gap: 0.55rem; padding: 0.42rem 0.55rem; border: 0; border-radius: 0.55rem; background: transparent; color: var(--nav-muted); cursor: pointer; font: inherit; font-size: 0.72rem; font-weight: 700; text-align: left; text-transform: uppercase; letter-spacing: 0.07em; transition: background 0.15s, color 0.15s; }
.sidebar-group-toggle:hover,
.sidebar-group.has-active .sidebar-group-toggle { background: var(--nav-hover-bg); color: var(--nav-fg-strong); }
.sidebar-group-toggle:focus-visible,
.sidebar-link:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.sidebar-group-icon { display: inline-flex; align-items: center; justify-content: center; width: 1.15rem; min-width: 1.15rem; height: 1.15rem; border: 0; background: transparent; color: var(--nav-muted); stroke: currentColor; stroke-width: 1.85; stroke-linecap: round; stroke-linejoin: round; fill: none; transition: color 0.15s; }
.sidebar-group-toggle:hover .sidebar-group-icon { color: var(--nav-fg-strong); }
.sidebar-group.has-active .sidebar-group-icon { color: var(--primary); }
.sidebar-group-caret { margin-left: auto; font-size: 0.62rem; color: var(--nav-muted); transition: transform 0.15s; }
.sidebar-group-toggle[aria-expanded="true"] .sidebar-group-caret { transform: rotate(180deg); }
.sidebar-submenu { border-left: 2px solid var(--nav-border); margin-left: 0.67rem; padding-left: 0.52rem; }
.sidebar-group.has-active .sidebar-submenu:not(.hidden) { border-left-color: var(--nav-active-fg); }
.sidebar-link.sidebar-child { font-size: 0.76rem; padding: 0.34rem 0.5rem; }
#sidebar.collapsed .sidebar-group-toggle { display: none; }
#sidebar.collapsed .sidebar-submenu { display: block !important; border-left: 0; margin-left: 0; padding-left: 0; }
#sidebar.collapsed #auth-user-label { display: none; }
#sidebar.collapsed #auth-user-box { padding-left: 0.25rem; padding-right: 0.25rem; }
#sidebar.collapsed #auth-logout-btn { display: inline-flex; align-items: center; justify-content: center; width: 100%; margin-top: 0; text-decoration: none; font-size: 0; }
#sidebar.collapsed #auth-logout-btn::before { content: '↩'; font-size: 14px; line-height: 1; }
#auth-user-box { background: var(--nav-bg); border-color: var(--nav-border); color: var(--nav-fg); }
#sidebar .text-gray-100 { color: var(--nav-fg-strong) !important; }
#sidebar .text-gray-200 { color: var(--nav-fg-strong) !important; }
#sidebar .text-gray-400 { color: var(--nav-fg) !important; }
#sidebar .text-gray-500 { color: var(--nav-muted) !important; }
@media (min-width: 1800px) {
  #sidebar { width: clamp(12.5rem, 9vw, 14rem); max-width: 14rem; }
}
@media (max-width: 980px) {
  #sidebar { width: 12rem; min-width: 12rem; }
}

/* ── Kanban y markdown de tarea: el segundo <style> de ops/public/index.html ── */
/* Kanban view (inline) */
#kanban-scroll { overflow-x: auto; overflow-y: visible; padding-bottom: 1rem; }
#kanban-board { display: flex; gap: 1rem; min-height: 60vh; padding: 4px; align-items: flex-start; }
.kb-col { flex: 0 0 280px; min-width: 280px; background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; display: flex; flex-direction: column; transition: opacity .15s; }
.kb-col.kb-col-dragging { opacity: .35; }
.kb-col.kb-col-drop-target { outline: 2px dashed #9ca3af; outline-offset: -2px; }
.kb-col-h { padding: .7rem .85rem; border-bottom: 1px solid #e5e7eb; display: flex; align-items: center; gap: .5rem; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #374151; cursor: grab; user-select: none; }
.kb-col-h:active { cursor: grabbing; }
.kb-col-h .kb-handle { color: #9ca3af; font-size: .7rem; letter-spacing: 0; }
.kb-col-h .kb-dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.kb-col-h .kb-n { margin-left: auto; color: #9ca3af; font-weight: 500; font-size: .7rem; }
.kb-col-body { padding: .5rem; display: flex; flex-direction: column; gap: .5rem; min-height: 40px; }
.kb-col-body.kb-dragover { background: rgba(17,24,39,.04); }
.kb-card { background: var(--c-surface); border: 1px solid #e5e7eb; border-left: 5px solid transparent; border-radius: 6px; padding: .65rem .75rem; cursor: grab; transition: background-color .15s, border-color .15s, box-shadow .15s; }
.kb-card:hover { border-color: #9ca3af; background: var(--c-surface-soft); box-shadow: 0 1px 4px rgba(0,0,0,0.04); }
.kb-card.kb-dragging { opacity: .4; cursor: grabbing; }
.kb-card.kb-tone-manual { border-left-color: #9b8f7c; }
.kb-card.kb-tone-auto { border-left-color: #5f8993; }
.kb-card.kb-tone-interactive { border-left-color: #a98242; }
.kb-card.kb-tone-manual:hover { background: color-mix(in srgb, #9b8f7c 12%, var(--c-surface)); }
.kb-card.kb-tone-auto:hover { background: color-mix(in srgb, #5f8993 12%, var(--c-surface)); }
.kb-card.kb-tone-interactive:hover { background: color-mix(in srgb, #a98242 12%, var(--c-surface)); }
.kb-title { font-size: .8rem; font-weight: 400; color: #111827; line-height: 1.35; margin-bottom: .35rem; }
.kb-meta { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; font-size: .65rem; color: #6b7280; }
.kb-pill { background: #f3f4f6; color: #4b5563; padding: .08rem .4rem; border-radius: 10px; font-size: .65rem; }
.kb-pill-exec { background: #fce7f3; color: #9f1239; }
.kb-pill-score { background: transparent; color: #9ca3af; padding: .08rem 0; }
.kb-empty { color: #9ca3af; font-size: .75rem; text-align: center; padding: .75rem 0; font-style: italic; }

/* Markdown en descripción de tareas */
.task-desc { line-height: 1.55; }
.task-desc h1, .task-desc h2, .task-desc h3 { font-weight: 600; color: #111827; margin: 1rem 0 .4rem; }
.task-desc h1 { font-size: 1.05rem; }
.task-desc h2 { font-size: 1rem; border-top: 1px solid #e5e7eb; padding-top: .75rem; }
.task-desc h3 { font-size: .95rem; }
.task-desc h1:first-child, .task-desc h2:first-child, .task-desc h3:first-child { margin-top: 0; border-top: 0; padding-top: 0; }
.task-desc p { margin: .5rem 0; }
.task-desc ul, .task-desc ol { margin: .4rem 0 .6rem 1.25rem; }
.task-desc li { margin: .15rem 0; }
.task-desc ul li { list-style: disc; }
.task-desc ul li.task-list-item, .task-desc ul:has(> li > input[type=checkbox]) { list-style: none; margin-left: .25rem; }
.task-desc input[type=checkbox] { margin-right: .45rem; transform: translateY(1px); }
.task-desc code { background: #eef2ff; color: #3730a3; padding: .05rem .35rem; border-radius: 4px; font-size: .88em; }
.task-desc pre { background: #0f172a; color: #e2e8f0; padding: .7rem .9rem; border-radius: 6px; overflow-x: auto; font-size: .85em; }
.task-desc pre code { background: transparent; color: inherit; padding: 0; }
.task-desc blockquote { border-left: 3px solid #d1d5db; padding: .1rem .75rem; color: #6b7280; margin: .6rem 0; font-style: italic; }
.task-desc hr { border: 0; border-top: 1px solid #e5e7eb; margin: 1rem 0; }
.task-desc strong { color: #111827; }
.task-desc a { color: #2563eb; text-decoration: underline; }
.task-desc table { width: 100%; border-collapse: collapse; margin: .5rem 0; font-size: .88em; }
.task-desc th, .task-desc td { border: 1px solid #e5e7eb; padding: .3rem .5rem; text-align: left; }
.task-desc th { background: #f3f4f6; }
