/* Estilo HOGARDEN: limpio tipo Notion (blanco, menú gris claro, letra sencilla)
   + estados con color vivo tipo Monday. Solo cambia el aspecto, no cómo funciona.
   "html:root" gana sobre los estilos originales sin importar el orden. */
html:root[data-theme="light"]{
  --bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F7F7F5; --surface-3:#F1F1EF;
  --line:#E9E9E7; --line-2:#DCDCD8;
  --ink:#37352F; --muted:#73726E; --faint:#A5A49F;
  --green:#00855A; --green-2:#00A86B; --green-soft:#DCF5E9; --on-accent:#FFFFFF;
  --terra:#D83A52; --terra-soft:#FDE3E7;
  --gold:#A86A00; --gold-soft:#FFF0D6;
  --danger:#D83A52; --danger-soft:#FBE1E5;
  --navy:#2F6FD1; --navy-soft:#E1EDFC; --purple:#8E4FD0;
  --side:#F7F7F5; --side-2:#EBEBE9; --side-ink:#37352F; --side-muted:#8A8985; --side-line:#E9E9E7;
  --shadow:0 0 0 1px rgba(15,15,15,.04),0 1px 3px rgba(15,15,15,.06);
  --shadow-lg:0 12px 32px rgba(15,15,15,.14);
  --scrim:rgba(15,15,15,.35);
  --display:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --r:8px; --r-sm:6px;
  color-scheme:light;
}
html:root[data-theme="light"] body{background:var(--bg);color:var(--ink)}
html:root[data-theme="light"] h1{font-weight:700;letter-spacing:-.02em}
html:root[data-theme="light"] h2,html:root[data-theme="light"] h3{font-weight:650;letter-spacing:-.01em}
/* Etiquetas y estados con color sólido suave (tipo Monday) */
html:root[data-theme="light"] .pill,html:root[data-theme="light"] .tag{border-radius:999px;font-weight:600}
/* Menú lateral claro tipo Notion */
html:root[data-theme="light"] aside{box-shadow:none}
html:root[data-theme="light"] nav .nb{border-radius:6px}
html:root[data-theme="light"] nav .nb.on,html:root[data-theme="light"] nav .nb[aria-current="page"]{background:var(--side-2);color:var(--side-ink);font-weight:600}
/* Botones del pie del menú: que el texto no se salga */
.hl-side button{overflow:hidden}
.hl-side button .t{overflow:hidden;text-overflow:ellipsis}