  /* ============================================================
     APP SHELL LAYOUT
     ============================================================ */
  #app{min-height:100%;}

  /* ---- Sidebar ---- */
  .sidebar{
    position:fixed; top:0; left:0; bottom:0;
    width:var(--sidebar-w);
    background:var(--bg-sidebar);
    color:var(--sidebar-text);
    display:flex; flex-direction:column;
    z-index:40;
    transition:width .18s ease, transform .22s ease;
    padding-left:env(safe-area-inset-left,0px);
  }
  body.is-collapsed .sidebar{ width:var(--sidebar-w-collapsed); }
  #app{ margin-left:var(--sidebar-w); transition:margin-left .18s ease; }
  body.is-collapsed #app{ margin-left:var(--sidebar-w-collapsed); }

  .brand{
    display:flex; align-items:center; gap:.75rem;
    padding:1.1rem 1.15rem;
    background-color:var(--accent);
    background-image:var(--dot-texture);
    background-size:9px 9px;
    border-bottom:1px solid var(--sidebar-border);
    min-height:32px;
  }
  body.is-collapsed .brand{ justify-content:center; padding:1.1rem .55rem; }
  .brand-mark{
    flex:none; width:46px; aspect-ratio:1.5625; display:block; overflow:hidden;
  }
  body.is-collapsed .brand-mark{ width:32px; }
  .brand-mark img{ display:block; width:100%; height:100%; object-fit:contain; }
  .brand-text{overflow:hidden; white-space:nowrap;}
  .brand-title{
    font-family:var(--font-display); font-size:14px; font-weight:700; color:var(--accent-contrast);
    line-height:1.28; text-transform:uppercase; letter-spacing:.035em;
  }
  .brand-sub{font-size:10px; text-transform:uppercase; letter-spacing:.1em; color:var(--accent-contrast); opacity:.78; margin-top:3px;}
  body.is-collapsed .brand-text{display:none;}

  .sidebar-scroll{flex:1; overflow-y:auto; padding:.85rem .65rem; }
  .sidebar-scroll::-webkit-scrollbar{width:6px;}
  .sidebar-scroll::-webkit-scrollbar-thumb{background:var(--sidebar-border); border-radius:4px;}

  .nav-group{margin-bottom:.35rem;}
  .nav-group-label{
    font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.09em;
    color:var(--sidebar-text-dim); padding:.9rem .65rem .35rem;
  }
  body.is-collapsed .nav-group-label{display:none;}

  .nav-item{
    display:flex; align-items:center; gap:.65rem;
    padding:.56rem .65rem; border-radius:var(--radius-s);
    color:var(--sidebar-text-dim); cursor:pointer;
    font-size:13.6px; font-weight:500;
    white-space:nowrap; overflow:hidden;
    border:none; background:none; width:100%; text-align:left;
  }
  .nav-item .icon{width:17px;height:17px;flex:none;}
  .nav-item:hover{background:rgba(255,255,255,0.05); color:var(--sidebar-text);}
  .nav-item.is-active{background:var(--accent); color:var(--accent-contrast);}
  .nav-item.is-active .icon{stroke:var(--accent-contrast);}
  .nav-item-label{overflow:hidden; text-overflow:ellipsis;}
  body.is-collapsed .nav-item-label{display:none;}
  body.is-collapsed .nav-item{justify-content:center;}

  .nav-sub{padding-left:1.55rem;}
  body.is-collapsed .nav-sub{display:none;}
  .nav-sub .nav-item{font-size:13px; padding:.46rem .65rem;}

  .sidebar-footer{
    border-top:1px solid var(--sidebar-border);
    padding:.75rem .8rem;
    display:flex; align-items:center; gap:.6rem;
  }
  .avatar{
    flex:none; width:32px; height:32px; border-radius:50%;
    background:var(--accent-soft); color:var(--accent-dark);
    display:flex; align-items:center; justify-content:center;
    font-size:12.5px; font-weight:700; font-family:var(--font-body);
  }
  .user-meta{overflow:hidden; white-space:nowrap;}
  body.is-collapsed .user-meta{display:none;}
  .user-name{font-size:13px; font-weight:600; color:var(--sidebar-text);}
  .user-role{font-size:11px; color:var(--sidebar-text-dim);}
  .collapse-btn{
    margin-left:auto; flex:none; width:26px; height:26px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:none; border:1px solid var(--sidebar-border); color:var(--sidebar-text-dim);
    cursor:pointer;
  }
  .collapse-btn:hover{color:var(--sidebar-text); border-color:var(--sidebar-text-dim);}
  body.is-collapsed .collapse-btn .icon{transform:rotate(180deg);}
  body.is-collapsed .sidebar-footer{justify-content:center;}
  body.is-collapsed .collapse-btn{margin-left:0;}

  .sidebar-scrim{display:none;}

  @media (max-width:900px){
    .sidebar{ transform:translateX(-100%); width:min(82vw, 300px); box-shadow:var(--shadow-pop); }
    body.drawer-open .sidebar{ transform:translateX(0); }
    #app{ margin-left:0 !important; }
    .collapse-btn{display:none;}
    .sidebar-scrim{
      display:none; position:fixed; inset:0; background:rgba(20,15,9,.45); z-index:39;
    }
    body.drawer-open .sidebar-scrim{display:block;}
  }

  /* ---- Header ---- */
  .topbar{
    position:sticky; top:0; z-index:20;
    height:var(--header-h);
    padding-top:env(safe-area-inset-top,0px);
    background:color-mix(in srgb, var(--bg) 92%, transparent);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--border-soft);
    display:flex; align-items:center; gap:.9rem;
    padding-left:1.4rem; padding-right:1.4rem;
  }
  .topbar-inner{display:flex; align-items:center; gap:.9rem; width:100%; height:100%;}
  .icon-btn{
    flex:none; width:34px; height:34px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background:none; border:1px solid transparent; color:var(--text-dim); cursor:pointer;
  }
  .icon-btn:hover{background:var(--bg-sunken); color:var(--text);}
  .icon-btn .icon{width:18px;height:18px;}
  .drawer-toggle{display:none;}
  @media (max-width:900px){ .drawer-toggle{display:flex;} }

  .breadcrumbs{display:flex; align-items:center; gap:.4rem; font-size:13px; color:var(--text-faint); overflow:hidden; white-space:nowrap;}
  .breadcrumbs b{color:var(--text); font-weight:600;}
  .breadcrumbs .crumb-sep{color:var(--text-faint); opacity:.6;}
  .breadcrumbs .crumb{cursor:pointer;}
  .breadcrumbs .crumb:hover{color:var(--text);}

  .topbar-spacer{flex:1;}

  .search-wrap{position:relative; width:230px;}
  @media (max-width:720px){ .search-wrap{display:none;} }
  .search-input{
    width:100%; height:34px; border-radius:var(--radius-s);
    border:1px solid var(--border); background:var(--bg-elev); color:var(--text);
    padding:0 .7rem 0 2.1rem; font-size:13px; font-family:inherit;
  }
  .search-input:focus{outline:none; border-color:var(--accent);}
  .search-wrap .icon{position:absolute; left:.65rem; top:50%; transform:translateY(-50%); width:15px; height:15px; color:var(--text-faint); pointer-events:none;}
  .search-results{
    position:absolute; top:calc(100% + 6px); left:0; right:0;
    background:var(--bg-elev); border:1px solid var(--border); border-radius:var(--radius-m);
    box-shadow:var(--shadow-pop); overflow:hidden; z-index:30;
  }
  .search-results button{
    display:flex; flex-direction:column; gap:1px; width:100%; text-align:left;
    padding:.55rem .8rem; border:none; background:none; cursor:pointer; color:var(--text);
    border-bottom:1px solid var(--border-soft); font-size:13px;
  }
  .search-results button:last-child{border-bottom:none;}
  .search-results button:hover{background:var(--bg-sunken);}
  .search-results .path{font-size:11px; color:var(--text-faint);}
  .search-empty{padding:.7rem .8rem; font-size:12.5px; color:var(--text-faint);}

  .btn{
    display:inline-flex; align-items:center; gap:.4rem;
    height:34px; padding:0 .85rem; border-radius:var(--radius-s);
    font-size:13px; font-weight:600; cursor:pointer; border:1px solid transparent;
    font-family:inherit;
  }
  .btn .icon{width:15px;height:15px;}
  .btn-primary{background:var(--accent); color:var(--accent-contrast);}
  .btn-primary:hover{background:var(--accent-dark);}
  .btn-ghost{background:none; border-color:var(--border); color:var(--text-dim);}
  .btn-ghost:hover{color:var(--text); border-color:var(--text-faint);}

  /* ---- Main / content ---- */
  main{padding:1.6rem 1.6rem 3.5rem;}
  @media (max-width:600px){ main{padding:1.15rem 1rem 3rem;} .topbar{padding-left:1rem; padding-right:1rem;} }
  .view{max-width:1180px; margin:0 auto;}

  .page-head{margin-bottom:1.6rem;}
  .page-eyebrow{font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.1em; color:var(--accent); margin-bottom:.5rem;}
  .page-title{font-size:26px;}
  .page-desc{color:var(--text-dim); font-size:14px; margin-top:.5rem; max-width:62ch;}

  /* ---- Badges / status system ---- */
  .badge{
    display:inline-flex; align-items:center; gap:.35rem;
    font-size:11px; font-weight:600; letter-spacing:.02em;
    padding:.24rem .55rem; border-radius:var(--radius-s); white-space:nowrap;
  }
  .badge::before{content:''; width:6px; height:6px; border-radius:50%; background:currentColor; flex:none;}
  .badge-neutral{background:var(--bg-sunken); color:var(--text-dim);}
  .badge-accent{background:var(--accent-soft); color:var(--accent-dark);}
  .badge-good{background:var(--good-soft); color:var(--good);}
  .badge-warn{background:var(--warn-soft); color:var(--warn);}
  .badge-bad{background:var(--bad-soft); color:var(--bad);}

  /* ---- Cards ---- */
  .card{
    background:var(--bg-elev); border:1px solid var(--border-soft);
    border-radius:var(--radius-l); padding:1.15rem 1.2rem;
  }

  /* Indicator / KPI cards */
  .kpi-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:.9rem; margin-bottom:1.8rem;}
  @media (max-width:900px){ .kpi-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:520px){ .kpi-grid{grid-template-columns:1fr;} }
  .kpi-card{display:flex; flex-direction:column; gap:.6rem;}
  .kpi-top{display:flex; align-items:flex-start; justify-content:space-between;}
  .kpi-icon{
    width:32px; height:32px; border-radius:var(--radius-s); background:var(--bg-sunken);
    display:flex; align-items:center; justify-content:center; color:var(--text-dim);
  }
  .kpi-icon .icon{width:16px;height:16px;}
  .kpi-value{font-family:var(--font-display); font-size:26px; font-weight:600; color:var(--text-faint); font-variant-numeric:tabular-nums;}
  .kpi-label{font-size:12.5px; font-weight:600; color:var(--text);}
  .kpi-caption{font-size:11.5px; color:var(--text-faint);}

  /* Flow diagram */
  .flow-section{margin-bottom:2rem;}
  .flow-head{display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom:.9rem; flex-wrap:wrap;}
  .flow-head h2{font-size:17px;}
  .flow-note{font-size:12.5px; color:var(--text-faint);}
  .flow-track{
    display:flex; align-items:center; gap:.4rem;
    overflow-x:auto; padding:.3rem .1rem .8rem;
  }
  .flow-chip{
    flex:none; display:flex; align-items:center; gap:.4rem;
    background:var(--bg-elev); border:1px solid var(--border-soft); border-radius:var(--radius-s);
    padding:.45rem .9rem; font-size:12.5px; font-weight:600; color:var(--text);
    font-family:var(--font-mono);
  }
  .flow-chip .dot{width:6px; height:6px; border-radius:50%; background:var(--accent);}
  .flow-arrow{flex:none; color:var(--text-faint); width:16px; height:16px;}

  /* Module cards grid */
  .module-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; margin-bottom:1.4rem;}
  @media (max-width:760px){ .module-grid{grid-template-columns:1fr;} }
  .module-card{
    text-align:left; cursor:pointer; display:flex; flex-direction:column; gap:.7rem;
    transition:border-color .12s ease;
  }
  .module-card:hover{border-color:var(--accent);}
  .module-card-top{display:flex; align-items:flex-start; justify-content:space-between; gap:.6rem;}
  .module-icon{
    width:38px; height:38px; border-radius:var(--radius-m); background:var(--bg-sunken); color:var(--text-dim);
    display:flex; align-items:center; justify-content:center; flex:none;
  }
  .module-icon .icon{width:19px;height:19px;}
  .module-card h3{font-size:17px;}
  .module-card p{font-size:13px; color:var(--text-dim);}
  .module-tags{display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.15rem;}
  .module-tag{font-size:11.5px; color:var(--text-dim); background:var(--bg-sunken); padding:.22rem .55rem; border-radius:var(--radius-s);}

  /* Transversal banner */
  .transversal-card{display:flex; flex-direction:column; gap:.85rem;}
  .transversal-top{display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;}
  .transversal-top-left{display:flex; align-items:center; gap:.7rem;}
  .transversal-chips{display:flex; flex-wrap:wrap; gap:.5rem;}
  .transversal-chip{
    display:flex; align-items:center; gap:.4rem; font-size:12.5px; font-weight:500;
    border:1px solid var(--border); border-radius:var(--radius-s); padding:.4rem .65rem; cursor:pointer; color:var(--text);
  }
  .transversal-chip:hover{border-color:var(--accent); color:var(--accent-dark);}
  .transversal-chip .icon{width:14px;height:14px; color:var(--text-faint);}

  /* ============================================================
     INICIO — rediseño (hero, indicadores reales/vacíos, módulos,
     panel lateral). Reemplaza el antiguo flow-section/transversal-card
     en esta pantalla (esas reglas quedan arriba sin uso, por si algún
     otro lugar las necesita más adelante).
     ============================================================ */
  /* HERO — un solo bloque visual (no 3 cards sueltas). Fondo cálido
     compartido por el texto y por la zona donde la foto se desvanece hacia
     ese mismo fondo (::before de .inicio-hero-photo), para que la foto se
     sienta integrada y no "pegada" como recorte rectangular. */
  .inicio-hero{
    display:grid; grid-template-columns:1fr 1.15fr; gap:0;
    margin-bottom:1.8rem; border-radius:var(--radius-l); overflow:hidden;
    background:var(--bg-elev); border:1px solid var(--border-soft); box-shadow:var(--shadow-card);
  }
  @media (max-width:760px){ .inicio-hero{grid-template-columns:1fr;} }
  .inicio-hero-text{display:flex; flex-direction:column; gap:.3rem; padding:1.8rem 1.8rem 1.8rem 2rem; justify-content:center;}
  .inicio-eyebrow{font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.1em; color:var(--accent); margin-bottom:.3rem;}
  .inicio-date{font-size:13.5px; color:var(--text-dim);}
  .inicio-greeting{font-size:var(--text-display); line-height:1.15; margin-top:.35rem;}
  .inicio-hero-subtitle{font-size:14px; color:var(--text-dim); max-width:34ch; margin-top:.25rem;}
  .inicio-hero-meta{margin-top:.7rem; display:flex; align-items:center; gap:.6rem; flex-wrap:wrap;}
  .inicio-actor-select{
    height:30px; border-radius:var(--radius-s); border:1px solid var(--border); background:var(--bg-elev);
    color:var(--text-dim); font-size:12px; font-family:inherit; cursor:pointer; padding:0 .5rem;
  }
  .inicio-actor-select:hover, .inicio-actor-select:focus{ border-color:var(--accent); color:var(--text); outline:none; }

  /* Acceso externo al SAC / Extranet de Justicia de Córdoba — a propósito no
     usa .btn ni .module-card: debe leerse como una herramienta externa
     integrada, no como navegación interna de Estudio OS. */
  .inicio-link-externo{
    display:inline-flex; align-items:center; gap:.4rem; height:30px; padding:0 .7rem;
    border-radius:999px; border:1px solid var(--accent); background:var(--accent-soft);
    color:var(--accent-dark, var(--accent)); font-size:12px; font-weight:600; text-decoration:none;
    white-space:nowrap; transition:background-color .12s ease, color .12s ease;
  }
  .inicio-link-externo .icon{flex:none;}
  .inicio-link-externo:hover{background:var(--accent); color:var(--accent-contrast);}

  .inicio-hero-photo{position:relative; min-height:280px;}
  .inicio-hero-photo img{width:100%; height:100%; display:block; object-fit:cover; object-position:58% 55%;}
  .inicio-hero-photo::before{
    /* Funde el borde izquierdo de la foto con el fondo del bloque de texto,
       para que se lea como una sola pieza y no como una card recortada. */
    content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
    background:linear-gradient(to right, var(--bg-elev) 0%, transparent 12%);
  }
  @media (max-width:760px){ .inicio-hero-photo{min-height:200px;} .inicio-hero-photo::before{background:linear-gradient(to bottom, var(--bg-elev) 0%, transparent 14%);} }

  .inicio-hero-quote{
    position:absolute; z-index:2; top:1.3rem; right:1.3rem; max-width:230px;
    background:color-mix(in srgb, var(--bg-elev) 82%, transparent);
    backdrop-filter:blur(6px); border-radius:var(--radius-m); padding:.85rem 1rem;
    box-shadow:var(--shadow-card);
  }
  .inicio-hero-quote p{
    font-family:var(--font-display); font-style:italic; color:var(--accent-dark); font-size:13.5px; margin:0;
  }
  @media (max-width:760px){ .inicio-hero-quote{position:static; max-width:none; margin:.9rem 1.2rem 1.2rem;} }

  .inicio-mini-cal{margin-bottom:.2rem;}
  .inicio-cal-head{font-size:12.5px; font-weight:600; color:var(--text-dim); margin-bottom:.5rem;}
  .inicio-cal-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:.2rem; text-align:center;}
  .inicio-cal-dow{margin-bottom:.2rem;}
  .inicio-cal-dow span{font-size:10px; color:var(--text-faint); font-weight:600;}
  .inicio-cal-cell{
    font-size:11.5px; color:var(--text-dim); border-radius:50%; aspect-ratio:1;
    display:flex; align-items:center; justify-content:center;
  }
  .inicio-cal-cell.is-today{background:var(--accent); color:var(--accent-contrast); font-weight:700;}
  .inicio-cal-cell.is-muted{visibility:hidden;}

  .inicio-kpi-row{display:flex; flex-wrap:wrap; gap:1rem; margin-bottom:2.2rem;}
  .inicio-kpi-row .kpi-card{flex:1 1 190px; max-width:230px; padding:1rem 1.1rem;}
  @media (max-width:900px){
    /* Tablet y mobile: 2x2 fijo en vez de que el wrap orgánico del flex
       decida cuántas entran por fila. */
    .inicio-kpi-row{display:grid; grid-template-columns:repeat(2,1fr); gap:.8rem;}
    .inicio-kpi-row .kpi-card{max-width:none;}
  }
  .kpi-card .kpi-value{color:var(--text);}
  .kpi-card .kpi-value.is-empty{color:var(--text-faint);}

  .inicio-section-head{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:.9rem;}
  .inicio-section-head h2{font-size:17px;}

  /* Módulos + Tu día: una sola composición (Tu día es la columna lateral
     derecha de la fila de módulos, no del hero). */
  .inicio-modulos-section{display:grid; grid-template-columns:3fr 1fr; gap:1.4rem; align-items:start; margin-bottom:2rem;}
  @media (max-width:1000px){ .inicio-modulos-section{grid-template-columns:1fr;} }

  .inicio-modulos-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;}
  @media (max-width:1000px){ .inicio-modulos-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:480px){ .inicio-modulos-grid{grid-template-columns:1fr;} }
  .inicio-modulos-grid .module-card{padding:1.2rem 1.25rem; gap:.5rem; border-color:transparent;}

  /* Un tono distinto por módulo, misma familia cálida (sección 8/9 del
     pedido) — por posición, ya que INICIO_MODULOS_DESTACADOS tiene un
     orden fijo (Gestión/Comercial/Finanzas/Casos). */
  .inicio-modulos-grid .module-card:nth-child(1){background:#F2E7D3;}
  .inicio-modulos-grid .module-card:nth-child(1) .module-icon{background:#E1CFA8; color:#6B4F26;}
  .inicio-modulos-grid .module-card:nth-child(2){background:#F5DBC5;}
  .inicio-modulos-grid .module-card:nth-child(2) .module-icon{background:var(--accent); color:var(--accent-contrast);}
  .inicio-modulos-grid .module-card:nth-child(3){background:#E3E8D9;}
  .inicio-modulos-grid .module-card:nth-child(3) .module-icon{background:#C3CFB4; color:#43593F;}
  .inicio-modulos-grid .module-card:nth-child(4){background:#EDDCE0;}
  .inicio-modulos-grid .module-card:nth-child(4) .module-icon{background:#D9B7BE; color:#7A4550;}
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      .inicio-modulos-grid .module-card:nth-child(1){background:#362A18;}
      .inicio-modulos-grid .module-card:nth-child(1) .module-icon{background:#4A3A20; color:#E4CE9F;}
      .inicio-modulos-grid .module-card:nth-child(2){background:#402615;}
      .inicio-modulos-grid .module-card:nth-child(3){background:#242E20;}
      .inicio-modulos-grid .module-card:nth-child(3) .module-icon{background:#33422C; color:#B9CBA9;}
      .inicio-modulos-grid .module-card:nth-child(4){background:#382326;}
      .inicio-modulos-grid .module-card:nth-child(4) .module-icon{background:#4A2E33; color:#D9A6AF;}
    }
  }
  :root[data-theme="dark"] .inicio-modulos-grid .module-card:nth-child(1){background:#362A18;}
  :root[data-theme="dark"] .inicio-modulos-grid .module-card:nth-child(1) .module-icon{background:#4A3A20; color:#E4CE9F;}
  :root[data-theme="dark"] .inicio-modulos-grid .module-card:nth-child(2){background:#402615;}
  :root[data-theme="dark"] .inicio-modulos-grid .module-card:nth-child(3){background:#242E20;}
  :root[data-theme="dark"] .inicio-modulos-grid .module-card:nth-child(3) .module-icon{background:#33422C; color:#B9CBA9;}
  :root[data-theme="dark"] .inicio-modulos-grid .module-card:nth-child(4){background:#382326;}
  :root[data-theme="dark"] .inicio-modulos-grid .module-card:nth-child(4) .module-icon{background:#4A2E33; color:#D9A6AF;}

  /* display:flex column: antes era un único hijo (Tu día) estirado a
     height:100% para igualar la columna principal; ahora que conviven con
     la tarjeta de Recursos jurídicos, cada uno toma su alto natural y el
     gap los separa, sin que ninguno se estire sobre el otro. */
  .inicio-modulos-side{display:flex; flex-direction:column; gap:1rem;}

  /* Recursos jurídicos: acceso rápido de consulta en el HOME (no es un
     módulo — por eso vive aparte de .inicio-modulos-grid, con su propio
     trato visual de "herramienta", no de módulo del ERP). */
  .inicio-recursos-btn{
    display:flex; align-items:center; gap:.8rem; width:100%;
    text-align:left; cursor:pointer; padding:1rem 1.1rem;
  }
  .inicio-recursos-btn:hover{border-color:var(--accent);}
  .inicio-recursos-icon{
    width:38px; height:38px; border-radius:var(--radius-s); flex:none;
    background:var(--accent-soft); color:var(--accent-dark);
    display:flex; align-items:center; justify-content:center;
  }
  .inicio-recursos-text{flex:1; min-width:0;}
  .inicio-recursos-text h3{font-size:14.5px; margin:0;}
  .inicio-recursos-text p{font-size:12px; color:var(--text-dim); margin:.15rem 0 0;}
  .inicio-recursos-btn > svg.icon:last-child{color:var(--text-faint); flex:none;}

  /* Panel de recursos (dentro del modal compartido) */
  .recursos-menu{display:flex; flex-direction:column; gap:.6rem;}
  .recursos-opcion{
    display:flex; align-items:center; gap:.8rem; width:100%; text-align:left; cursor:pointer;
    padding:.9rem 1rem; border:1px solid var(--border-soft); border-radius:var(--radius-m);
    background:var(--bg-sunken); transition:border-color .12s ease, background-color .12s ease;
  }
  .recursos-opcion:hover{border-color:var(--accent); background:var(--accent-soft);}
  .recursos-opcion-icon{
    width:36px; height:36px; border-radius:50%; flex:none;
    background:var(--accent-soft); color:var(--accent-dark);
    display:flex; align-items:center; justify-content:center;
  }
  .recursos-opcion:hover .recursos-opcion-icon{background:var(--bg-elev);}
  .recursos-opcion-text{flex:1; min-width:0;}
  .recursos-opcion-text h4{font-size:14px; margin:0;}
  .recursos-opcion-text p{font-size:12px; color:var(--text-dim); margin:.15rem 0 0;}
  .recursos-opcion > svg.icon:last-child{color:var(--text-faint); flex:none;}

  .recursos-doc{display:flex; flex-direction:column; gap:.7rem;}
  .recursos-doc-head{display:flex; align-items:center; justify-content:space-between; gap:.6rem; flex-wrap:wrap;}
  .recursos-doc-frame{
    width:100%; height:60vh; min-height:360px; border:1px solid var(--border-soft);
    border-radius:var(--radius-s); background:var(--bg-sunken);
  }

  .inicio-panel{display:flex; flex-direction:column; gap:.7rem;}
  .inicio-panel-head{display:flex; align-items:center; justify-content:space-between; gap:.6rem;}
  .inicio-panel-head h3{font-size:15px;}

  .inicio-empty-mini{display:flex; flex-direction:column; align-items:flex-start; gap:.5rem; padding:.3rem 0 .05rem; color:var(--text-faint);}
  .inicio-empty-mini .icon{color:var(--text-faint);}
  .inicio-empty-mini p{font-size:13px; color:var(--text-dim); max-width:38ch;}
  .inicio-empty-note{font-size:11.5px; color:var(--text-faint);}

  .inicio-bottom-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem;}
  @media (max-width:1000px){ .inicio-bottom-grid{grid-template-columns:1fr 1fr;} }
  @media (max-width:640px){ .inicio-bottom-grid{grid-template-columns:1fr;} }

  .inicio-accion-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.55rem;}
  .inicio-accion-item{display:flex; align-items:center; justify-content:space-between; gap:.6rem; padding:.5rem 0; border-bottom:1px solid var(--border-soft);}
  .inicio-accion-item:last-child{border-bottom:none; padding-bottom:0;}
  .inicio-accion-main{display:flex; flex-direction:column; gap:.15rem; overflow:hidden;}
  .inicio-accion-titulo{font-size:13.5px; font-weight:600; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
  .inicio-accion-meta{font-size:11.5px; color:var(--text-faint);}

  .inicio-donut-row{display:flex; align-items:center; gap:1.2rem;}
  .inicio-donut{
    width:74px; height:74px; border-radius:50%; flex:none;
    display:flex; align-items:center; justify-content:center; position:relative;
  }
  .inicio-donut::before{content:''; position:absolute; inset:9px; border-radius:50%; background:var(--bg-elev);}
  .inicio-donut span{position:relative; font-size:14px; font-weight:700; font-family:var(--font-display);}
  .inicio-donut-legend{display:flex; flex-direction:column; gap:.35rem;}
  .inicio-donut-legend div{display:flex; align-items:baseline; gap:.4rem; font-size:12px; color:var(--text-faint);}
  .inicio-donut-legend b{font-size:15px; color:var(--text); font-family:var(--font-display);}

  /* Pulido visual sidebar/topbar — sin cambios funcionales ni de markup */
  .nav-item{transition:background .15s ease, color .15s ease;}
  .nav-item.is-active{box-shadow:inset 2px 0 0 var(--accent-contrast);}
  .icon-btn{transition:background .15s ease, color .15s ease;}
  .breadcrumbs{transition:color .15s ease;}

  /* Sub-nav pills used on group landing pages */
  .subnav{display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.4rem;}
  .subnav-pill{
    font-size:12.5px; font-weight:600; padding:.4rem .8rem; border-radius:var(--radius-s);
    border:1px solid var(--border); color:var(--text-dim); cursor:pointer;
  }
  .subnav-pill:hover{color:var(--text); border-color:var(--text-faint);}
  .subnav-pill.is-active{background:var(--text); color:var(--bg-elev); border-color:var(--text);}

  .children-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:.9rem;}
  @media (max-width:900px){ .children-grid{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:560px){ .children-grid{grid-template-columns:1fr;} }
  .child-card{display:flex; flex-direction:column; gap:.5rem; cursor:pointer;}
  .child-card:hover{border-color:var(--accent);}
  .child-card-top{display:flex; align-items:center; justify-content:space-between; gap:.5rem;}
  .child-card h4{font-size:14.5px;}
  .child-card p{font-size:12px; color:var(--text-faint);}

  /* Empty state (leaf / under construction) */
  .empty-state{
    display:flex; flex-direction:column; align-items:flex-start; gap:1rem;
    padding:2.6rem 2rem; text-align:left;
  }
  .empty-icon{
    width:52px; height:52px; border-radius:var(--radius-m); background:var(--bg-sunken); color:var(--text-dim);
    display:flex; align-items:center; justify-content:center;
  }
  .empty-icon .icon{width:24px;height:24px;}
  .empty-state h2{font-size:20px;}
  .empty-state p{color:var(--text-dim); font-size:13.5px; max-width:56ch;}
  .empty-back{
    display:inline-flex; align-items:center; gap:.4rem; font-size:13px; font-weight:600;
    color:var(--accent-dark); cursor:pointer; margin-top:.2rem;
  }
  .empty-back .icon{width:14px;height:14px; transform:rotate(180deg);}

  /* Table system (defined & ready, not populated yet) */
  .table-wrap{overflow-x:auto; border:1px solid var(--border-soft); border-radius:var(--radius-m);}
  table.data-table{width:100%; border-collapse:collapse; font-size:13px;}
  table.data-table th{
    text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.06em;
    color:var(--text-faint); font-weight:600; padding:.6rem .85rem; border-bottom:1px solid var(--border-soft);
    background:var(--bg-sunken);
  }
  table.data-table td{padding:.65rem .85rem; border-bottom:1px solid var(--border-soft); color:var(--text);}
  table.data-table tr:last-child td{border-bottom:none;}

  /* ---- Modal system ---- */
  .modal-backdrop{
    position:fixed; inset:0; background:rgba(20,15,9,.45); z-index:60;
    display:flex; align-items:center; justify-content:center; padding:1.2rem;
  }
  .modal-backdrop[hidden]{display:none;}
  .modal{
    width:100%; max-width:520px; max-height:min(82vh,640px); overflow-y:auto;
    background:var(--bg-elev); border-radius:var(--radius-l); border:1px solid var(--border-soft);
    box-shadow:var(--shadow-pop); padding:1.5rem;
  }
  .modal-head{display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:1rem;}
  .modal-head h3{font-size:18px;}
  .modal-body{display:flex; flex-direction:column; gap:1rem; font-size:13.5px; color:var(--text-dim);}
  .modal-body b{color:var(--text);}
  .pillar-row{display:flex; gap:.7rem; align-items:flex-start;}
  .pillar-dot{width:8px; height:8px; border-radius:50%; background:var(--accent); margin-top:6px; flex:none;}
  .legend-row{display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.2rem;}

