@import url('https://fonts.googleapis.com/css2?family=Gluten:wght@100..900&family=Gochi+Hand&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
/* ═══════════════════════════════════════════════════════════════
   1. RESET E BASE TIPOGRÁFICA
═══════════════════════════════════════════════════════════════ */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  box-sizing: border-box;
  font-family: "nunito", sans-serif;
  font-size: 12pt;
  font-weight: 400;
  letter-spacing: 0.016em;
  line-height: 1.2em;
}

body {
  min-height: 100vh;
  background: transparent;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smooth: always;
  text-rendering: optimizeLegibility;
}

*, *::before, *::after { box-sizing: inherit; }

img[src$=".svg"] {
  opacity: 0.85;
  filter: drop-shadow(0.5px 0.5px 1px rgba(0,0,0,0.1));
}


/* ═══════════════════════════════════════════════════════════════
   2. HEADINGS
═══════════════════════════════════════════════════════════════ */
h1 {
  font-size: clamp(1.2em, 3vw, 1.8em);
  font-weight: 700;
  margin: 0 0 12px;
  background: linear-gradient(120deg, #015acd, #e7006c, #c55f00, #7b2dff, #015acd);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: amizar-text-move 22s linear infinite;
}

h2 {
  font-size: clamp(1em, 2vw, 1.4em);
  font-weight: 500;
  margin: 0 0 12px;
  background: linear-gradient(120deg, #015acd, #e7006c, #c55f00, #7b2dff, #015acd);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: amizar-text-move 22s linear infinite;
}

/* h3–h5: gradiente verde → azul */
h3, h4, h5 {
  margin: 0;
  text-align: center;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
h3 { font-weight: 600; font-size: 1.2em; line-height: 1.2em; background-image: linear-gradient(to right, #6c9000, #0066cc); }
h4 { font-weight: 600; font-size: 0.9em; line-height: 1.2em; padding: 1.5em 0 0 0; background-image: linear-gradient(to right, #6c9000, #0066cc); }
h5 { font-weight: 100; font-size: 0.9em; line-height: 1.2em; padding: 1.5em 0 0 0; background-image: linear-gradient(to right, #9ed106, #0066cc); }

h6 {
  font-weight: 600; font-size: 1em; line-height: 1em;
  padding: 1em 0 0 0; margin: 0;
  color: #e01e1e; text-align: center; display: inline-block;
}
h7 {
  font-weight: 100; font-size: 0.9em; line-height: 2em;
  padding: 1em 0 0 0; margin: 0;
  color: rgba(0,0,0,0.4); text-align: center;
}
h8 {
  font-weight: bold; font-size: 1.6em; line-height: 1.5em;
  padding: 1em 0 0 0; margin: 0; text-align: left;
}


/* ═══════════════════════════════════════════════════════════════
   3. ELEMENTOS BÁSICOS (label, hr, a, ul, button)
═══════════════════════════════════════════════════════════════ */
label {
  font-weight: 100; font-size: 0.7em;
  text-align: left; line-height: 1em;
  padding: 1.5em 0 0 1em; margin: 0;
  color: rgba(0,0,0,0.7);
}

hr {
  width: 100%;
  border: 0;
  height: 1px;
  margin: 1em;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(1,90,205,.22),
    rgba(231,0,108,.22),
    rgba(123,45,255,.22),
    transparent
  );
  opacity: 1;
}

a { color: #144966; text-decoration: none; transition: color 0.2s ease; }
a:hover { color: #468686; }

ul { text-align: center; padding: 0; font-size: 9pt; font-weight: 100; list-style: none; }

button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 0 10px;
  padding: 4px 15px;
  border-radius: 999px;
  border: 0.6px solid #6d6d6d;
  background: rgba(255,255,255,0.4);
  color: rgba(0,0,0,0.85);
  font-size: 0.7em;
  font-weight: 600;
  cursor: pointer;
  filter: none;
  animation: none;
  transition: all 0.3s ease;
}

button:hover {
  background: rgba(255,255,255,0.65);
  box-shadow: 0 2px 5px rgba(0,0,0,0.08);
}

button:active {
  transform: scale(0.97);
}

@media print { button { display: none; } }


/* ═══════════════════════════════════════════════════════════════
   4. FORMULARIOS
═══════════════════════════════════════════════════════════════ */
.form-input,
.form-textarea {
  width: 90%;
  max-width: 450px;
  min-height: 12px;
  color: rgb(35,35,35);
  padding: 5px 15px;
  border-radius: 8px;
  font-size: 0.85em;
  text-align: center;
  border: 1px solid rgba(255,255,255,0.7);
  background: rgba(0,0,0,0.03);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.2);
  transition: background-color 0.3s, transform 0.3s;
  resize: none;
}
.form-input:focus,
.form-textarea:focus {
  background-color: rgba(0,0,0,0.06);
  outline: none;
  transform: scale(1.03);
}

select.form-input {
  background-color: rgba(0,0,0,0.05);
  color: #333;
  padding: 12px;
  font-size: 12px;
  width: 98%;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

input[type="date"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 10px;
  max-width: 400px;
  cursor: pointer;
  text-align: center;
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 16px 16px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='18' rx='2' ry='2'/><line x1='16' y1='2' x2='16' y2='6'/><line x1='8' y1='2' x2='8' y2='6'/><line x1='3' y1='10' x2='21' y2='10'/></svg>");
}

::placeholder {
  color: #666; text-shadow: none; opacity: 1;
  font-style: italic; letter-spacing: 0.03em;
  font-size: 0.9em; text-align: center;
}
::-ms-input-placeholder {
  color: #666; text-shadow: none;
  font-style: italic; letter-spacing: 0.03em;
  font-size: 0.9em; text-align: center;
}

.submit-button {
  display: block; width: 120px; padding: 12px;
  background: rgba(255,255,255,0.1); color: #fff;
  font-size: 10pt; font-weight: 500;
  border: none; border-radius: 8px; cursor: pointer;
}
.submit-button:hover { background: rgba(148,232,123,0.3); }

.forms { width: 200px; font-size: 10pt; background-color: transparent; }

fieldset {
  padding: 12px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.6);
  background: rgba(255,255,255,0.5);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.4);
  margin-bottom: 2em;
}
fieldset legend {
  padding: 3px 20px; font-size: 0.85em; font-weight: 400;
  color: rgba(0,0,0,0.82); border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.52);
  background: rgb(244,244,244);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.4);
}


/* ═══════════════════════════════════════════════════════════════
   5. TÁBOAS
═══════════════════════════════════════════════════════════════ */
table { width: 100%; margin: 30px auto; border-collapse: collapse; }
th, td { padding: 10px; text-align: center; vertical-align: top; }
th { background-color: rgba(0,0,0,0.1); font-size: 10pt; color: rgb(65,65,65); }
tr:nth-child(even) { background-color: rgba(0,0,0,0.05); }
td a { margin-right: 10px; }

/* Variantes de cabeceiras */
th.encabezado  { max-width: 150px; min-width: 90px; line-height: 1.2em; padding: 1em 3em; }
th.encabezado2 { max-width: 200px; line-height: 0.9em; font-size: 0.8em; padding: 1em 1em 1em 2em; }
th.encabezado3 { max-width: 120px; min-width: 90px; line-height: 1.2em; padding: 1em; vertical-align: top; }

/* Columnas panel */
.panel  { line-height: 1.2em; padding: 1em 0 1em 1em; font-weight: 400; text-align: left; vertical-align: top; }
th.panel2 { width: 25%; line-height: 1.2em; padding: 1em 3em 0 1em; font-weight: 100; text-align: center; vertical-align: top; }
th.panel3 { width: 75%; line-height: 1.2em; padding: 1em 3em; font-weight: 100; vertical-align: top; }
th.panel4 { width: 60%; line-height: 1.5em; padding: 2em 1em 1em; font-weight: 100; text-align: center; vertical-align: top; }
th.panel5 { width: 40%; line-height: 1.5em; padding: 2em 1em 1em; font-weight: 100; vertical-align: top; }
th.panel6 { width: 70%; line-height: 1.5em; padding: 1em; font-size: 0.8em; font-weight: 100; text-align: center; vertical-align: top; }
th.panel7 { width: 30%; line-height: 1.2em; padding: 1em; font-weight: 100; vertical-align: top; }

/* Columnas especializadas */
.accs  { width: 120px; line-height: 2em; font-size: 0.8em; padding: 1.5em 0.5em; text-align: right; vertical-align: middle; }
.user  { width: 120px; line-height: 1.25em; font-size: 1.8em; padding: 2em 0 2em 0.5em; text-align: left; vertical-align: middle !important; }
.user2 { width: 70px; text-align: center; vertical-align: middle !important; }
.medic { max-width: 300px; min-width: 100px; line-height: 1.8em; font-size: 0.9em; padding: 1em 0.5em; text-align: center; vertical-align: middle !important; }
.medic2{ max-width: 300px; min-width: 90px;  line-height: 1.8em; font-size: 0.7em; padding: 0.5em;    text-align: center; vertical-align: middle !important; }
.tlf   { max-width: 300px; min-width: 80px;  line-height: 1.5em; font-size: 0.7em; padding: 1em 0 1em 0.5em; text-align: center; vertical-align: middle !important; }
.diari1{ width: 180px; line-height: 1.2em; font-size: 0.95em; padding: 0.5em; text-align: center; }
.diari2{ width: 180px; line-height: 1.5em; font-size: 0.8em;  padding: 1em 0.5em;  text-align: center; }
.diari3{ line-height: 1.5em; font-size: 1.1em; padding: 2em 0.5em; text-align: center; }

td img { width: 75px; height: 75px; object-fit: cover; border-radius: 50%; }


/* ═══════════════════════════════════════════════════════════════
   6. LISTAS E CLASES DE TEXTO
═══════════════════════════════════════════════════════════════ */
.rgt  { text-align: center; padding: 0; font-size: 8pt;  line-height: 2.5em; font-weight: 100; list-style: none; }
.rgt2 { text-align: center; padding: 0 1em 0 0; font-size: 10pt; font-weight: 100; list-style: none; }
.rgt3 { text-align: left;   margin: 0.1em 0 0 0.8em;    font-size: 8pt;  font-weight: 100; }

.cita-pasada { opacity: 0.5; }
.inactivo    { color: rgba(0,0,0,0.3); font-style: italic; }

.lista-scroll {
  height: 100%; overflow-y: auto;
  -webkit-mask-image: linear-gradient(to bottom, black 0%, black 75%, rgba(0,0,0,0.6) 90%, transparent 100%);
  mask-image: linear-gradient(to bottom, black 0%, black 75%, rgba(0,0,0,0.6) 90%, transparent 100%);
}



/* ═══════════════════════════════════════════════════════════════
   7. TARXETAS E COMPOÑENTES
═══════════════════════════════════════════════════════════════ */

/* Tarxeta visual xenérica (estilo moderno suave) */
.card-ui {
  border-radius: 16px;
  margin: 1em;
  border: 1px solid rgba(0, 104, 190, 0.4);
  background: rgba(0, 104, 190, 0.08);
  padding: 8px 15px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  cursor: pointer;
}


.card {
  position: relative;
  overflow: hidden;

  opacity: 0;
  transform: translateY(18px);

  transition:
    transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);

  will-change: transform, opacity;

  animation: cardFadeIn .55s cubic-bezier(.22,1,.36,1) both;
}

.card:hover {
  transform: translateY(0) translateX(2px);
}

@keyframes cardFadeIn {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.card:nth-child(1)  { animation-delay: .03s; }
.card:nth-child(2)  { animation-delay: .06s; }
.card:nth-child(3)  { animation-delay: .09s; }
.card:nth-child(4)  { animation-delay: .12s; }
.card:nth-child(5)  { animation-delay: .15s; }
.card:nth-child(6)  { animation-delay: .18s; }
.card:nth-child(7)  { animation-delay: .21s; }
.card:nth-child(8)  { animation-delay: .24s; }
.card:nth-child(9)  { animation-delay: .27s; }
.card:nth-child(10) { animation-delay: .30s; }
.card:nth-child(11) { animation-delay: .33s; }
.card:nth-child(12) { animation-delay: .36s; }
.card:nth-child(n+12) { animation-delay: .39s; }

.card:hover {
  transform: translateX(2px);
}

/* brillo que cruza unha vez */
.card::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255,255,255,0.3),
    transparent
  );
  transform: skewX(-20deg);
  pointer-events: none;
}

.card:hover::after {
  animation: card-shine 1.1s ease forwards;
}

/* Non mostrar o brillo nas tarxetas abertas */
.card.open::after,
.card.open:hover::after,
.persoal-form.open .card::after,
.persoal-form.open .card:hover::after {
  animation: none !important;
  opacity: 0 !important;
}

@keyframes card-shine {
  from {
    left: -75%;
  }
  to {
    left: 125%;
  }
}

.tarxeta {
  font-weight: 100; background: rgba(241,241,241,0.3);
  padding: 1em 1em 0.1em 2em; margin-bottom: 2em;
  border-radius: 10px; border-top: 1px solid #ccc; border-left: 3px solid #ccc;
}
.tarxeta.activo  { border-color: green; }
.tarxeta.inactivo{ border-color: red; opacity: 0.6; }

.a4-container { width: 100%; max-width: 21cm; margin: auto; padding: 0; }

.info-centro { text-align: left; font-size: 0.9em; opacity: 0.4; margin: 0.5em 0; }

/* Iconas de enlace */
.icon-link  { width: 12px !important; height: auto !important; border-radius: 0 !important; opacity: 0.6 !important; vertical-align: text-bottom; margin-left: 5px; }
.icon-link2 { width: 12px !important; height: auto !important; border-radius: 0 !important; opacity: 0.6 !important; vertical-align: text-bottom; margin-right: 5px; }
.accion-link { font-size: 0.85em; display: inline-block; text-align: right; color: #2b4e53; text-decoration: none; transition: color 0.3s; }
.accion-link:hover { color: #007BFF; }


/* ═══════════════════════════════════════════════════════════════
   8. SCROLL HINT
═══════════════════════════════════════════════════════════════ */
.scroll-hint { max-height: 370px; overflow-y: auto; position: relative; }
.scroll-hint__inner { transform: translateY(0); }
.scroll-hint.has-more .scroll-hint__inner { animation: hintMove 4s ease-in-out 1; }

@keyframes hintMove {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-120px); }
  100% { transform: translateY(0); }
}


/* ═══════════════════════════════════════════════════════════════
   9. BARRA DE MENÚ CLÁSICA
═══════════════════════════════════════════════════════════════ */
.barra-menu { background-color: rgb(87,93,87); padding: 8px; font-size: 12px; color: #9baa9b; text-align: center; }
.barra-menu a { display: inline-block; margin: 0 10px; padding: 8px 10px; background-color: #575d57; color: #fff; text-decoration: none; border-radius: 8px; font-size: 12px; transition: background-color 0.3s ease; }
.barra-menu a:hover { background-color: #818c81; }
.barra-menu span { display: inline-block; margin: 0 10px; padding: 8px 10px; color: #9baa9b; font-size: 12px; }


/* ═══════════════════════════════════════════════════════════════
   10. SIDEBAR DIVIDER
═══════════════════════════════════════════════════════════════ */
.sidebar-divider { margin: 6px 0 1px 0; }
.sidebar-divider hr { border: none; height: 1px; background: rgba(0,0,0,0.1); box-shadow: inset 0 1px 0 rgba(255,255,255,0.15); margin: 0 0 2px 0; }
.sidebar-divider p  { margin: 0; font-size: 0.58em; font-weight: 600; text-align: left; letter-spacing: 0.08em; color: rgba(0,0,0,0.4); text-transform: uppercase; }


/* ═══════════════════════════════════════════════════════════════
   11. ANIMACIÓNS AMIZAR (borde degradado animado)
═══════════════════════════════════════════════════════════════ */

/* Animación compartida de borde */
@keyframes amizar-border-move {
  0%   { background-position: 0% 50%, 0% 50%; }
  100% { background-position: 0% 50%, 300% 50%; }
}

/* Versión só-borde para menús */
@keyframes amizar-border-move-simple {
  0%   { background-position: 0% 50%; }
  100% { background-position: 300% 50%; }
}

@keyframes amizarGradientMove {
  0%, 100% { background-position: 0% 50%, 0% 50%; }
  50%       { background-position: 100% 50%, 100% 50%; }
}

/* Tarxeta Amizar */
.amizar-card {
  border: 2px solid transparent; border-radius: 12px; padding: 30px; box-sizing: border-box;
  background:
    linear-gradient(130deg, #eaecff, #ffeaf4, #fff8de) padding-box,
    linear-gradient(90deg, #516eff, #ec0086, #ffcc00, #516eff) border-box;
  background-size: 200% 200%, 300% 300%;
  animation: amizarGradientMove 24s ease infinite;
}

/* Botón IA */
.amizar-ia-btn {
  position: relative; display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 15px; border-radius: 999px; border: 0.6px solid transparent;
  filter:
    drop-shadow(0 0 2px rgba(222,228,255,0.5))
    drop-shadow(0 0 4px rgba(255,200,231,0.5))
    drop-shadow(0 0 6px rgba(255,246,209,0.5));
  background:
    linear-gradient(130deg, #eaecff, #ffeaf4, #fff8de) padding-box,
    linear-gradient(90deg, #516eff, #ff229f, #ffcc00, #516eff) border-box;
  background-size: 100% 100%, 300% 300%;
  animation: amizar-border-move 11s linear infinite;
  color: rgba(0,0,0,0.85); font-size: 0.7em; font-weight: 600; cursor: pointer;
  transition: all 0.3s ease;
}
.amizar-ia-btn:active { transform: scale(0.97); }
.amizar-ia-btn:hover {
  box-shadow: 0 2px 5px rgba(0,0,0,0.15), 0 0 4px rgba(81,110,255,0.3), 0 0 6px rgba(236,0,134,0.2);
}
.amizar-ia-btn .ia-icon { width: 12px; height: 12px; display: block; opacity: 0.7; }
.amizar-ia-btn .ia-text { line-height: 1; }

.amizar-ia-btn.secondary {
  background: rgba(255,255,255,0.4);
  border: 0.6px solid #6d6d6d;
  filter: none;
  animation: none;
}


/* ═══════════════════════════════════════════════════════════════
   12. ORBE IA
═══════════════════════════════════════════════════════════════ */
/* ===== Container ===== */
.ia-orbe-wrap {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  opacity: 0;
  transform: scale(0);
  animation: iaIntro 0.95s cubic-bezier(0.22, 1, 0.36, 1) both;
}

/* ===== Orbe ===== */
.ia-orbe {
  width: 26px;      
  height: 26px;
  padding:1em;
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
  margin-inline: -5px;
  /* Glow central difuso (substitúe o ::after antigo) */
  background: radial-gradient(
    circle at 50% 50%,
    rgb(247, 255, 231) 0%,
    rgba(255, 255, 255, 0.18) 35%,
    rgba(255, 255, 255, 0) 72%
  );
  animation: ia-breathe 2.8s ease-in-out infinite;
}

/* RING EXTERIOR — 12 puntos GRANDES, rotación CW lenta */
.ia-orbe::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  z-index: 2;
  background-repeat: no-repeat;
  background:
    radial-gradient(circle 1.5px at 88% 50%, #4564ff 95%, transparent 100%),
    radial-gradient(circle 1.5px at 83% 31%, #ff27a1 95%, transparent 100%),
    radial-gradient(circle 1.5px at 69% 17%, #ffd42a 95%, transparent 100%),
    radial-gradient(circle 1.5px at 50% 12%, #4564ff 95%, transparent 100%),
    radial-gradient(circle 1.5px at 31% 17%, #ff27a1 95%, transparent 100%),
    radial-gradient(circle 1.5px at 17% 31%, #ffd42a 95%, transparent 100%),
    radial-gradient(circle 1.5px at 12% 50%, #4564ff 95%, transparent 100%),
    radial-gradient(circle 1.5px at 17% 69%, #ff27a1 95%, transparent 100%),
    radial-gradient(circle 1.5px at 31% 83%, #ffd42a 95%, transparent 100%),
    radial-gradient(circle 1.5px at 50% 88%, #4564ff 95%, transparent 100%),
    radial-gradient(circle 1.5px at 69% 83%, #ff27a1 95%, transparent 100%),
    radial-gradient(circle 1.5px at 83% 69%, #ffd42a 95%, transparent 100%);
  animation:
    ia-spin 9.2s linear infinite,
    ia-dots-out 2.6s ease-in-out infinite;
}

/* RING INTERIOR — 8 puntos PEQUENOS, rotación CCW máis rápida */
.ia-orbe::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  z-index: 3;
  background-repeat: no-repeat;
  background:
    radial-gradient(circle 0.9px at 75% 50%, #ff27a1 95%, transparent 100%),
    radial-gradient(circle 0.9px at 68% 32%, #ffd42a 95%, transparent 100%),
    radial-gradient(circle 0.9px at 50% 25%, #4564ff 95%, transparent 100%),
    radial-gradient(circle 0.9px at 32% 32%, #ff27a1 95%, transparent 100%),
    radial-gradient(circle 0.9px at 25% 50%, #ffd42a 95%, transparent 100%),
    radial-gradient(circle 0.9px at 32% 68%, #4564ff 95%, transparent 100%),
    radial-gradient(circle 0.9px at 50% 75%, #ff27a1 95%, transparent 100%),
    radial-gradient(circle 0.9px at 68% 68%, #ffd42a 95%, transparent 100%);
  animation:
    ia-spin-reverse 12.8s linear infinite,
    ia-dots-in 2.6s ease-in-out infinite;
}

/* ===== Animacións ===== */
@keyframes iaIntro {
  0%   { opacity: 0; transform: scale(0); }
  60%  { opacity: 1; transform: scale(1.1); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes ia-spin         { to { transform: rotate(360deg);  } }
@keyframes ia-spin-reverse { to { transform: rotate(-360deg); } }

@keyframes ia-breathe {
  0%, 100% {
    filter:
      drop-shadow(0 0 3px rgba(222, 228, 255, 0.7))
      drop-shadow(0 0 6px rgba(255, 200, 231, 0.4));
  }
  50% {
    filter:
      drop-shadow(0 0 6px rgba(222, 228, 255, 0.95))
      drop-shadow(0 0 12px rgba(255, 200, 231, 0.6));
  }
}

/* Os dous aneis alternan brillo: cando un baixa, o outro sobe.
   Da sensación de "respiración entre capas" e ese feel "con vida". */
@keyframes ia-dots-out {
  0%, 100% { opacity: 1;    }
  50%      { opacity: 0.45; }
}
@keyframes ia-dots-in {
  0%, 100% { opacity: 0.55; }
  50%      { opacity: 1;    }
}

/* texto */
.amizar-ia-text {
  font-size: 0.8em;
  font-weight: 300;
  white-space: nowrap;
  opacity: 0;
  transform: translateX(-24px);
  animation:
    amizar-text-move 22s linear infinite,
    iaTextIntro .85s cubic-bezier(.22,1,.36,1) .18s both;
background: linear-gradient(
  120deg,
  #015acd,
  #e7006c,
  #c55f00,
  #7b2dff,
  #015acd
);
  background-size: 300% 100%;
  -webkit-background-clip: text;
          background-clip: text;
  color: transparent;
}

/* ===== Keyframes ===== */

@keyframes iaIntro {
  0%   { opacity: 0; transform:  scale(0); }
  20%  { opacity: 1; transform:  scale(0); }
  100% { opacity: 1; transform:  scale(1); }
}

@keyframes iaTextIntro {
  from { opacity: 0; transform: translateX(-24px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes ia-spin {
  to { transform: rotate(360deg); }
}

@keyframes ia-breathe {
  0%, 100% { transform: scale(0.9);opacity: 0.55; }
  50%      { transform: scale(1.2);opacity: 1; }
}

@keyframes ia-core-pulse {
  0%, 100% {
    transform: scale(1);
    opacity: 0.5;
  }
  50% {
    transform: scale(1.25);
    opacity: 1;
  }
}

@keyframes amizar-text-move {
  0%   { background-position: 0% 50%; }
  100% { background-position: 300% 50%; }
}
/* ═══════════════════════════════════════════════════════════════
   13. LAYOUT FEATUREX (contedor principal de páxinas internas)
═══════════════════════════════════════════════════════════════ */
.featurex {
  display: flex; flex-wrap: wrap; margin: 0; background: transparent;
}

.featurex article {
  text-align: center;
  padding: 0.8em;
  background: transparent;
  border-radius: 8px;
  font-size: 0.9em;
  margin: 0;
  width: 100%;
  min-height: 400px;
  height: 100%;
  box-sizing: border-box;
  overflow: hidden;
}
.featurex article:nth-child(2n) { margin-right: 0; }

/* Imaxes dentro de article */
.featurex article .image {
  border-radius: 18px; display: block;
  margin: -1.75em -1.75em -0.1em -1.75em;
  position: relative; width: calc(100% + 3.5em);
}
.featurex article .image img { border-radius: 18px; width: 100%; }

.featurex article .imaxe {
  filter: drop-shadow(rgba(0,0,0,0.35) 0px 1px 2px);
  display: block; border-radius: 13px;
  margin: -1.3em -1.3em 1.5em -1.3em;
  position: relative; width: calc(100% + 2.6em);
}
.featurex article .imaxe img { border-radius: 13px; filter: drop-shadow(rgba(0,0,0,0.35) 0px 1px 2px); width: 100%; }

.featurex article .map {
  filter: opacity(80%) hue-rotate(-10deg) sepia(20%) drop-shadow(rgba(0,0,0,0.35) 0px 1px 2px);
  display: block; border-radius: 13px;
  margin: -1.3em -1.3em -2em -1.3em;
  position: relative; width: calc(100% + 2.6em);
}

.featurex article .video {
  border-radius: 18px;
  filter: drop-shadow(rgba(0,0,0,0.55) 0px 0px 3px);
  display: block;
  margin: -1.72em -1.77em -0.1em -1.77em;
  position: relative;
  width: calc(100% + 3.53em);
  height: calc(100% + 1.83em);
}
.featurex article .video img { border-radius: 18px; width: 100%; }

/* Sección novis (páxinas de usuarios web) */
.novis {
  display: flex; flex-wrap: wrap; margin: 0; background: transparent;
}


/* ═══════════════════════════════════════════════════════════════
   14. TOP NAV (menú horizontal de pestanas)
═══════════════════════════════════════════════════════════════ */
.top-nav {
  position: sticky; top: 0; z-index: 20;
  display: flex; flex-wrap: wrap; gap: 8px;
  padding: 6px; margin: 0;
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 0.5px solid rgb(255, 255, 255);
    box-shadow: 0 14px 30px -18px rgba(0,0,0,.45), inset 0 .5px 1px rgba(255,255,255,.7);
  justify-content: center; align-items: center;
  border-radius: 20px; margin:0.5em 1em 0.5em 1em;
  opacity: 0;
  backdrop-filter: blur(5px);
  animation: navFadeIn .85s ease forwards;
}

@keyframes navFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.top-nav a {
  display: inline-flex; position: relative; overflow: hidden;
  align-items: center; gap: 3px;
  padding: 6px 18px; border-radius: 99px;
  text-decoration: none; color: #222;
  font-size: 0.75em; font-weight: 700; line-height: 0.8;
  transition: background 0.2s ease, box-shadow 0.2s ease; cursor: pointer;
  opacity: 0;
  transform: translateX(-24px);
  animation: navLinkIn .65s cubic-bezier(.22,1,.36,1) both;
}
.top-nav a:hover { background: rgb(255, 255, 255); }

.top-nav a img   { width: 16px; height: 16px; opacity: 0.65; object-fit: contain; flex-shrink: 0; }

.top-nav a:nth-child(1) { animation-delay: .04s; }
.top-nav a:nth-child(2) { animation-delay: .08s; }
.top-nav a:nth-child(3) { animation-delay: .12s; }
.top-nav a:nth-child(4) { animation-delay: .16s; }
.top-nav a:nth-child(5) { animation-delay: .20s; }
.top-nav a:nth-child(6) { animation-delay: .24s; }
.top-nav a:nth-child(7) { animation-delay: .28s; }
.top-nav a:nth-child(8) { animation-delay: .32s; }
.top-nav a:nth-child(9) { animation-delay: .36s; }
.top-nav a:nth-child(10){ animation-delay: .40s; }
.top-nav a:nth-child(n+11){ animation-delay: .46s; }

@keyframes navLinkIn {
  from {
    opacity: 0;
    transform: translateX(-24px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.top-nav a.active {
  background: rgba(255,255,255,0.55);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);
}
/* Borde animado no tab activo */
.top-nav a.active::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  background: linear-gradient(90deg, #516eff, #ec0086, #ffcc00, #516eff);
  background-size: 300% 100%; background-position: 0% 50%;
  will-change: background-position;
  animation: amizar-border-move-simple 12s linear infinite;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none;
}

/* Shell do iframe */
.iframe-shell {
  position: relative; width: 100%;
  height: calc(100vh - 86px); min-height: 0;
  overflow: hidden; background: transparent; margin: 0;
}
.mainframe-iframe {
  width: 100%; height: 100%; min-height: 0;
  border: none; border-radius: 8px; background: transparent;
  display: block; vertical-align: top;
  opacity: 1; transition: opacity .7s ease; will-change: opacity;
}
.mainframe-iframe.loading { opacity: 0.1; }

@media (max-width: 900px) {
  .top-nav { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .top-nav::-webkit-scrollbar { display: none; }
  .top-nav a { flex: 0 0 auto; white-space: nowrap; }
  .iframe-shell { height: calc(100vh - 88px); min-height: 0; }
  .mainframe-iframe { min-height: 0; }
}


/* ═══════════════════════════════════════════════════════════════
   15. ANIMACIÓNS GLOBAIS
═══════════════════════════════════════════════════════════════ */
@keyframes ffadeIn {
  from { opacity: 0; transform: translateY(-20px); }
  to   { opacity: 1; transform: translateY(0); }
}

.intro01{
  opacity: 0;
  transform: translateY(-18px);
  will-change: transform, opacity;
  animation:
    intro01Fade 1.2s cubic-bezier(.22,1,.36,1) both;
}

@keyframes intro01Fade{
  from{ opacity: 0; transform: translateY(-18px);}
  to{opacity: 1; transform: translateY(0);}
}

.intro02{
  opacity: 0;
  transform: scale(0.8);
  will-change: transform, opacity;
  animation:
    intro02Fade 2.6s cubic-bezier(.22,1,.36,1) both;
}

@keyframes intro02Fade{
  from{ opacity: 0; transform: scale(0.95); }
  to{ opacity: 1; transform: scale(1);}
}

.intro03{
  opacity: 0;
  transform: scale(0.9);
  will-change: transform, opacity;
  animation:
    intro03Fade 2.6s cubic-bezier(.22,1,.36,1) both;
}

@keyframes intro03Fade{
  0%    { opacity: 0; transform: scale(0.95); }
  20%   { opacity: 0; transform: scale(0.95); }
  100%  { opacity: 1; transform: scale(1);}
}

.intro04{
  opacity: 0;
  transform: scale(0.9);
  will-change: transform, opacity;
  animation:
    intro04Fade .9s cubic-bezier(.22,1,.36,1) both;
}

@keyframes intro04Fade{
  0%    { opacity: 0; transform: scale(0.95); }
  100%  { opacity: 1; transform: scale(1);}
}

.intro05{
  opacity: 0;
  transform: translateY(18px);
  will-change: transform, opacity;
  animation:
    intro05Fade 1.2s cubic-bezier(.22,1,.36,1) both;
}
@keyframes intro05Fade{
  from{ opacity: 0; transform: translateY(18px);}
  to{opacity: 1; transform: translateY(0);}
}

.intro06{
  opacity: 0;
  transform: translateX(18px);
  will-change: transform, opacity;
  animation:
    intro06Fade .6s cubic-bezier(.22,1,.36,1) both;
}
@keyframes intro06Fade{
  from{ opacity: 0; transform: translateX(18px);}
  to{opacity: 1; transform: translateX(0);}
}

.intro07{
  display:inline-block;
  opacity: 0;
  transform: scale(0.9);
  will-change: transform, opacity;
  animation:
    intro07Fade 2.6s cubic-bezier(.22,1,.36,1) both;
}

@keyframes intro07Fade{
  0%    { opacity: 0; transform: scale(0.95); }
  100%  { opacity: 0.45; transform: scale(1);}
}

.intro08 {
  position: relative;
  overflow: hidden;
  opacity: 0;
  transform: translateY(28px);
  transition:transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform, opacity;
  animation: intro08FadeIn .55s cubic-bezier(.22,1,.36,1) both;
}

@keyframes intro08FadeIn {
  from {
    opacity: 0;
    transform: translateY(28px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.intro08:nth-child(1)  { animation-delay: .18s; }
.intro08:nth-child(2)  { animation-delay: .24s; }
.intro08:nth-child(3)  { animation-delay: .30s; }
.intro08:nth-child(4)  { animation-delay: .36s; }
.intro08:nth-child(5)  { animation-delay: .42s; }
.intro08:nth-child(6)  { animation-delay: .48s; }
.intro08:nth-child(7)  { animation-delay: .54s; }
.intro08:nth-child(8)  { animation-delay: .60s; }
.intro08:nth-child(9)  { animation-delay: .66s; }
.intro08:nth-child(10) { animation-delay: .72s; }
.intro08:nth-child(11) { animation-delay: .78s; }
.intro08:nth-child(12) { animation-delay: .84s; }

.intro08:nth-child(n+12) {
  animation-delay: .90s;
}

.intro09{
  opacity: 0;
  transform: scale(0.9);
  will-change: transform, opacity;
  animation:
    intro09Fade 6s cubic-bezier(.22,1,.36,1) both;
}

@keyframes intro09Fade{
  0%    { opacity: 0; transform: scale(0.95); }
  40%   { opacity: 0; transform: scale(0.95); }
  100%  { opacity: 1; transform: scale(1);}
}

/* ═══════════════════════════════════════════════════════════════
   16. ESPECÍFICOS PÁXINAS
═══════════════════════════════════════════════════════════════ */
/* --- anotar.php */
.anot-card{border:1px solid rgba(111,182,34,.4);border-radius:14px;margin:.7em;background:rgba(111,182,34,.06);position:relative;overflow:hidden;transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .25s ease;will-change:transform;}
.anot-card:hover{transform:translateX(2px);}
.anot-card::after{content:"";position:absolute;top:0;left:-75%;width:50%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);pointer-events:none;}
.anot-card:hover::after{animation:anot-shine 1.1s ease forwards;}
@keyframes anot-shine{from{left:-75%;}to{left:125%;}}
.anot-header{display:flex;justify-content:space-between;align-items:center;padding:2px 15px;cursor:pointer;font-size:.75em;font-weight:600;background:rgba(0,0,0,.04);}
.anot-user{font-weight:normal;opacity:.7;}
.anot-body{max-height:0;overflow:hidden;padding:0 12px;opacity:0;transition:max-height .3s ease,opacity .2s ease;}
.anot-card.open .anot-body{max-height:500px;padding:10px 12px;opacity:1;}

/* ── Calendario.php ── */
#cal-layout{display:flex;gap:14px;height:calc(100vh);padding:12px 12px 20px;box-sizing:border-box;overflow:visible;}
.cal-panel{display:flex;flex-direction:column;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.1);backdrop-filter:blur(10px);box-shadow:0 8px 24px rgba(0,0,0,.12);}
.cal-header{padding:9px 14px;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.15);display:flex;align-items:center;gap:8px;font-weight:700;font-size:.82em;letter-spacing:.05em;text-transform:uppercase;opacity:.8;}
.cal-scroll{flex:1;overflow-y:auto;padding:12px 14px;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.12) transparent;}
.cal-scroll::-webkit-scrollbar{width:4px;}
.cal-scroll::-webkit-scrollbar-thumb{background:rgba(0,0,0,.12);border-radius:4px;}
#panel-cal{flex:1;}
#panel-info{flex:0 0 30%;display:flex;flex-direction:column;gap:12px;min-height:0;}
#panel-info::-webkit-scrollbar{display:none;}
#panel-info .cal-panel{flex-shrink:0;}
#panel-resumo{flex:1;min-height:100px;}

.nav-bar{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.btn-nav{border:1px solid rgba(0,0,0,.15);background:rgba(255,255,255,.2);border-radius:7px;padding:4px 12px;cursor:pointer;font-weight:700;font-size:.85em;margin:0;transition:background .15s;}
.btn-nav:hover{background:rgba(255,255,255,.4);}
.btn-nav.today{background:rgba(0,80,200,.15);color:#003880;}
#nav-label{font-weight:700;font-size:.9em;min-width:200px;text-align:center;}

.sel-hint{font-size:.72em;opacity:.5;text-align:center;margin-bottom:8px;}
.sel-hint span{background:rgba(0,80,200,.15);color:#003880;padding:2px 8px;border-radius:8px;font-weight:700;}

.months-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
@media (max-width:900px){.months-grid{grid-template-columns:1fr 1fr;}}

.mini-month{border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);}
.mini-month-title{text-align:center;font-weight:700;font-size:.8em;padding:7px 0;background:rgba(0,0,0,.06);letter-spacing:.04em;}
.mini-month-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;padding:4px;}
.dow-header{text-align:center;font-size:.62em;font-weight:700;opacity:.45;padding:3px 0;}

.day-cell{text-align:center;font-size:.7em;padding:4px 2px;border-radius:4px;cursor:pointer;position:relative;user-select:none;transition:background .12s;min-height:26px;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.day-cell:hover{background:rgba(0,80,200,.12);}
.day-cell.empty{cursor:default;}
.day-cell.empty:hover{background:transparent;}
.day-cell.today{background:rgba(255,200,0,.35);font-weight:700;}
.day-cell.today:hover{background:rgba(255,200,0,.5);}
.day-cell.weekend{opacity:.65;}
.day-cell.sel-start,.day-cell.sel-end{background:rgba(0,80,200,.4)!important;color:#003880;font-weight:700;}
.day-cell.in-range{background:rgba(0,80,200,.12);}

.day-events{display:flex;gap:2px;justify-content:center;flex-wrap:wrap;margin-top:1px;}
.day-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}

.day-cell.has-event{border-radius:0;}
.day-cell.ev-start{border-radius:5px 0 0 5px!important;}
.day-cell.ev-end{border-radius:0 5px 5px 0!important;}
.day-cell.ev-solo{border-radius:5px!important;}

.f-group{display:flex;flex-direction:column;gap:3px;margin-bottom:8px;}
.f-label{font-size:.68em;font-weight:600;opacity:.6;text-transform:uppercase;letter-spacing:.04em;}
.f-group .form-input{width:100%;max-width:none;text-align:left;border-radius:7px;font-size:.82em;padding:6px 9px;box-sizing:border-box;}
.f-group select.form-input{padding:4px 9px;}

.btn-crear{display:block;width:100%;padding:8px;border-radius:8px;border:none;background:rgba(0,80,200,.75);color:#fff;font-weight:700;font-size:.83em;cursor:pointer;margin:0;transition:background .2s;}
.btn-crear:hover{background:rgba(0,80,200,1);}
.flash-msg{font-size:.75em;padding:5px 10px;border-radius:6px;margin-top:6px;}
.flash-ok{background:rgba(198,239,206,.85);color:#1e4620;}
.flash-err{background:rgba(248,215,218,.85);color:#721c24;}

.resumo-item{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid rgba(0,0,0,.07);font-size:.78em;}
.resumo-item:last-child{border-bottom:none;}
.resumo-cor{width:10px;height:10px;border-radius:50%;flex-shrink:0;}
.resumo-nome{flex:1;font-weight:600;}
.resumo-dias{font-weight:700;font-size:.95em;background:rgba(0,0,0,.07);padding:2px 8px;border-radius:8px;}

.evt-item{padding:6px 8px;border-radius:7px;margin-bottom:5px;border:1px solid rgba(255,255,255,.18);font-size:.75em;display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);cursor:pointer;transition:background .15s;}
.evt-item:hover{background:rgba(255,255,255,.25);}
.evt-cor{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.evt-body{flex:1;}
.evt-title{font-weight:700;}
.evt-dates{opacity:.55;}

.btn-del-evt{border:none;background:rgba(200,0,0,.1);color:#900;border-radius:5px;padding:2px 6px;cursor:pointer;font-size:.8em;margin:0;transition:background .15s;flex-shrink:0;}
.btn-del-evt:hover{background:rgba(200,0,0,.25);}

#modal-bg{display:none;position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.45);justify-content:center;align-items:center;}
#modal-bg.visible{display:flex;}

.modal-box{background:rgba(240,245,255,.97);border-radius:14px;padding:20px;max-width:380px;width:90%;box-shadow:0 12px 40px rgba(0,0,0,.25);}
.modal-box h3{margin:0 0 12px;font-size:.95em;}
.modal-box p{margin:4px 0;font-size:.82em;}

.modal-actions{display:flex;gap:8px;margin-top:14px;justify-content:flex-end;}
.btn-modal-close{border:1px solid rgba(0,0,0,.15);background:rgba(255,255,255,.6);border-radius:7px;padding:6px 14px;cursor:pointer;font-size:.8em;margin:0;}
.btn-modal-del{border:none;background:rgba(200,0,0,.7);color:#fff;border-radius:7px;padding:6px 14px;cursor:pointer;font-size:.8em;font-weight:700;margin:0;}
.btn-modal-del:hover{background:rgba(200,0,0,1);}

/* ── contable.php ── */
#cont-layout{display:flex;gap:14px;height:calc(100vh);padding:12px 12px 20px;box-sizing:border-box;overflow:visible;}

.cont-panel{display:flex;flex-direction:column;min-height:0;border-radius:14px;overflow:visible;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.12);backdrop-filter:blur(10px);box-shadow:0 8px 24px rgba(0,0,0,.1);}
#panel-chart{background:transparent!important;border:none!important;box-shadow:none!important;backdrop-filter:none!important;}

.panel-header{padding:10px 14px;flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.15);display:flex;align-items:center;gap:8px;font-weight:700;font-size:.82em;letter-spacing:.06em;text-transform:uppercase;opacity:.75;}

.panel-scroll{flex:1;overflow-y:auto;padding:10px 12px 14px;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.12) transparent;}
.panel-scroll::-webkit-scrollbar{width:4px;}
.panel-scroll::-webkit-scrollbar-thumb{background:rgba(0,0,0,.12);border-radius:4px;}

#panel-ing{flex:0 0 55%;}
#panel-right{flex:1;display:flex;flex-direction:column;gap:14px;min-height:0;overflow:visible;}
#panel-chart{flex:0 0 auto;}
#panel-gas{flex:1;min-height:0;}

.kpi-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.kpi-chip{flex:1;min-width:110px;border-radius:10px;padding:8px 12px;display:flex;flex-direction:column;gap:2px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.12);}
.kpi-label{font-size:.68em;opacity:.6;font-weight:600;text-transform:uppercase;letter-spacing:.05em;}
.kpi-val{font-size:1em;font-weight:700;}

.kpi-ing{border-color:rgba(0,150,20,.3);background:rgba(0,150,20,.07);}
.kpi-ing .kpi-val{color:#1e5c20;}
.kpi-gas{border-color:rgba(190,0,0,.25);background:rgba(190,0,0,.06);}
.kpi-gas .kpi-val{color:#720808;}
.kpi-bal{border-color:rgba(0,90,200,.25);background:rgba(0,90,200,.06);}
.kpi-bal .kpi-val{color:#003880;}
.kpi-bal-neg{border-color:rgba(190,0,0,.3);background:rgba(190,0,0,.07);}
.kpi-bal-neg .kpi-val{color:#720808;}

.tabs{display:flex;gap:4px;margin-bottom:8px;}
.tab-btn{border:none;border-radius:8px;padding:5px 12px;margin:0;font-size:.75em;font-weight:600;cursor:pointer;opacity:.55;background:rgba(255,255,255,.18);color:inherit;transition:background .15s,opacity .15s;}
.tab-btn:hover{opacity:.8;}
.tab-btn.active{opacity:1;}
.tabs-ing .tab-btn.active{background:rgba(0,150,20,.18);color:#1a5c1e;}
.tabs-gas .tab-btn.active{background:rgba(190,0,0,.15);color:#6a0808;}

.tab-pane{display:none;}
.tab-pane.active{display:block;}

.ficha{border-radius:8px;padding:8px 10px;margin-bottom:6px;border:1px solid rgba(0,150,20,.2);background:rgba(255,255,255,.2);font-size:.78em;line-height:1.5;}
.ficha.actual{border-color:rgba(0,150,20,.5);background:rgba(0,150,20,.08);}
.ficha.pasado{opacity:.72;}
.ficha-titulo{font-size:.9em;font-weight:700;margin-bottom:3px;}
.ficha-row{display:flex;justify-content:space-between;gap:8px;}
.ficha-row span:first-child{opacity:.6;}
.ficha-hr{border:none;border-top:1px solid rgba(0,0,0,.09);margin:4px 0;}
.ficha-total{font-weight:700;}

.ficha-gas{border-color:rgba(190,0,0,.2);}
.ficha-gas.actual{border-color:rgba(190,0,0,.45);background:rgba(190,0,0,.06);}

.ano-badge{display:inline-block;font-size:.65em;font-weight:700;padding:1px 6px;border-radius:10px;background:rgba(0,0,0,.08);opacity:.55;margin-left:4px;}

.gest-link{display:inline-flex;align-items:center;gap:5px;font-size:.75em;font-weight:600;opacity:.6;padding:3px 8px;border-radius:6px;border:1px solid rgba(0,0,0,.14);background:rgba(255,255,255,.2);margin-bottom:8px;color:inherit;transition:opacity .15s;text-decoration:none;}
.gest-link:hover{opacity:1;color:inherit;}

.empty{font-size:.82em;opacity:.4;text-align:center;padding:18px 0;}

.chart-wrap{position:relative;width:100%;height:170px;}