:root{
  --bg:#0f0e16;
  --surface:#171827ee;
  --surface-solid:#171827;
  --text:#e8eaff;
  --muted:#a6add4;
  --brand:#b48cff;
  --accent:#8ea6ff;
  --ok:#34d399;
  --danger:#ef4444cc;
  --warn:#f59e0bcc;
  --chip:#2a2d47;
  --border:#373a62;
  --shadow:0 10px 25px rgba(0,0,0,.5);
  --field-bg:#1f2140;
  --field-bg-filled:#30345c;

  --bg-g1:#3b3357;
  --bg-g2:#171827;
  --bg-g3:#0f0e16;
  --card-g1:#2a2d47;
  --card-g2:#2f314f;
  --card-g3:#52557c;

  --panel:#0f1321;
  --panel-2:#151c30;
  --ink:var(--text);
  --primary:color-mix(in srgb, var(--brand) 56%, #22d3ee 44%);
  --ghost:rgba(15,23,42,.74);
  --field:var(--field-bg);
  --radius:12px;
  --space:14px;
  --line-height:1.25;
  --glass:blur(18px) saturate(1.35);

  --bg-blob-1:color-mix(in srgb, var(--brand) 84%, #22d3ee 16%);
  --bg-blob-2:color-mix(in srgb, var(--accent) 76%, #a78bfa 24%);
  --bg-blob-3:#f472b6;
  --bg-blob-4:#a3e635;

  --ambient-opacity:.95;
  --ambient-blur:58px;
  --ambient-sat:1.35;

  --safe-top:env(safe-area-inset-top, 0px);
  --safe-right:env(safe-area-inset-right, 0px);
  --safe-bottom:env(safe-area-inset-bottom, 0px);
  --safe-left:env(safe-area-inset-left, 0px);

  --border-subtle:color-mix(in srgb, var(--border) 55%, transparent);
  --surface-card:linear-gradient(145deg, rgba(15,23,42,.88), rgba(15,23,42,.68));
  --header-h:56px;
  --footer-h:56px;
  --toolbar-gap:14px;

  --caso:#6ee7b7;
  --posible_evidencia:#fbbf24;
  --aporte:#60a5fa;
  --implicado:#f472b6;
  --testigo:#a78bfa;
  --accion:#34d399;
  --resultado:#f87171;
  --categoria:#f59e0b;
  --area:#93c5fd;

  --indicio:#7dd3fc;
  --contexto:#93c5fd;
  --normativa:#f59e0b;
  --incidente:#fca5a5;
  --registro:#60a5fa;
  --patron:#a78bfa;
  --mitigacion:#10b981;
  --detonante:#f43f5e;
  --afectacion:#eab308;
  --vinculo:#22d3ee;
  --organizacion:#8b5cf6;
  --cronologia:#94a3b8;
  --descargo:#059669;

  --sueno:#7dd3fc;
  --intuicion:#f472b6;
  --percepcion:#22d3ee;
  --sensacion:#facc15;
  --idea:#a3e635;
  --propuesta:#34d399;
  --coincidencia:#a78bfa;
  --curiosidad:#fb923c;
  --creencia:#f59e0b;
  --experiencia:#93c5fd;
  --persona:#f9a8d4;
  --animal:#86efac;
  --cosa:#c4b5fd;
  --emocion:#f43f5e;
  --pensamiento:#94a3b8;
  --recuerdo:#fbbf24;
  --simbolo:#10b981;
  --metafora:#8b5cf6;
  --deseo:#ef4444;
  --miedo:#0ea5e9;
  --valor:#6ee7b7;
  --necesidad:#06b6d4;
  --limite:#64748b;
  --habito:#d946ef;
  --objetivo:#22c55e;
  --agradecimiento:#84cc16;
  --logro:#f97316;
  --duda:#a3a3a3;

  --link-adjunta:#8b5cf6;
  --link-involucra:#06b6d4;
  --link-atestigua:#f97316;
  --link-ocurre:#38bdf8;
  --link-conduce:#22c55e;
  --link-relacionada:#a3a3a3;
  --link-reporta:#f43f5e;
  --link-afecta:#eab308;
  --link-asignado:#10b981;
  --link-deriva:#ef4444;
  --link-duplica:#64748b;
  --link-menciona:#94a3b8;

  --link-evoca:#22d3ee;
  --link-simboliza:#f472b6;
  --link-sugiere:#fb923c;
  --link-desencadena:#f43f5e;
  --link-predispone:#a3e635;
  --link-confirma:#10b981;
  --link-refuta:#ef4444;
  --link-requiere:#64748b;
}

html, body{
  min-height:100%;
  margin:0;
}

*{ box-sizing:border-box; }

body{
  position:relative;
  overflow:hidden;
  color:var(--text);
  font:14px/1.4 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;
  background:linear-gradient(120deg, var(--bg-g1), var(--bg-g2) 60%, var(--bg-g3));
  isolation:isolate;
}

body::before{
  content:"";
  position:fixed;
  inset:-22vmax;
  pointer-events:none;
  z-index:-2;
  background:
    radial-gradient(900px 700px at 14% 14%, color-mix(in srgb, var(--bg-blob-1) 74%, transparent) 0%, transparent 62%),
    radial-gradient(900px 700px at 90% 10%, color-mix(in srgb, var(--bg-blob-2) 72%, transparent) 0%, transparent 64%),
    radial-gradient(950px 720px at 78% 90%, color-mix(in srgb, var(--bg-blob-3) 70%, transparent) 0%, transparent 66%),
    radial-gradient(1100px 820px at 18% 92%, color-mix(in srgb, var(--bg-blob-4) 64%, transparent) 0%, transparent 68%),
    linear-gradient(180deg, rgba(255,255,255,.32), rgba(255,255,255,.08));
  filter:blur(var(--ambient-blur)) saturate(var(--ambient-sat)) contrast(1.04);
  opacity:var(--ambient-opacity);
}

button,
input,
select,
textarea{
  font:inherit;
}

a{ color:inherit; }

.page-root{
  height:100dvh;
  min-height:100vh;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr) auto;
  gap:10px;
  overflow:hidden;
  position:relative;
  z-index:0;
}

.page-root::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background-image:radial-gradient(rgba(255,255,255,.08) 1px, transparent 1px);
  background-size:4px 4px;
  opacity:.08;
}

.hidden{ display:none !important; }
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.btn{
  border-radius:999px;
  border:1px solid var(--border-subtle);
  background:
    radial-gradient(circle at 30% 0%, rgba(255,255,255,.18), transparent 55%),
    linear-gradient(145deg, rgba(15,23,42,.92), rgba(15,23,42,.78));
  color:var(--text);
  padding:8px 14px;
  font-size:.9rem;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  cursor:pointer;
  box-shadow:0 10px 26px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.10);
  transition:background .16s ease, border-color .16s ease, box-shadow .18s ease, transform .08s ease, filter .16s ease;
}

.btn:hover{
  background:
    radial-gradient(circle at 30% 0%, rgba(255,255,255,.26), transparent 55%),
    linear-gradient(145deg, color-mix(in srgb, var(--bg-blob-2) 22%, rgba(15,23,42,.92)), rgba(15,23,42,.78));
  border-color:color-mix(in srgb, var(--accent) 65%, white);
  box-shadow:0 14px 30px rgba(0,0,0,.62), 0 0 22px color-mix(in srgb, var(--bg-blob-1) 28%, transparent);
  transform:translateY(-1px);
  filter:brightness(1.03);
}

.btn:active{ transform:translateY(0); filter:brightness(.98); }
.btn:disabled{ opacity:.55; cursor:not-allowed; box-shadow:none; transform:none; filter:none; }
.btn.primary{
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.30) 0, transparent 55%),
    linear-gradient(145deg, #4ade80, #22c55e, #16a34a);
  border-color:rgba(34,197,94,.95);
  color:#022c16;
  box-shadow:0 14px 42px rgba(22,163,74,.52), 0 0 0 1px rgba(21,128,61,.72) inset, 0 0 40px rgba(34,197,94,.20);
}
.btn.ghost{
  background:
    radial-gradient(circle at 30% 0%, rgba(148,163,184,.18), transparent 55%),
    linear-gradient(145deg, rgba(15,23,42,.90), rgba(15,23,42,.74));
  border-color:var(--border-subtle);
}
.btn.danger{
  background:
    radial-gradient(circle at 30% 0%, rgba(255,255,255,.20), transparent 55%),
    linear-gradient(145deg, #fb7185, #ef4444, #b91c1c);
  border-color:rgba(248,113,113,.95);
  color:#fff5f5;
}
.btn.ghost.danger{
  background:
    radial-gradient(circle at 30% 0%, rgba(255,255,255,.10), transparent 55%),
    linear-gradient(145deg, rgba(80,17,28,.92), rgba(80,17,28,.72));
  border-color:rgba(248,113,113,.32);
  color:#fecaca;
}
.btn.small{ padding:6px 10px; font-size:12px; }
.btn.icon{ width:28px; height:28px; padding:0; }

.sel,
.input,
.sel-compact,
.tags-input input{
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(15,23,42,.86);
  color:var(--text);
  padding:8px 10px;
  min-width:0;
}

textarea.input{
  resize:vertical;
  min-height:84px;
}

.select-like,
select.input,
select.sel,
select.sel-compact{
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='%23a6add4' d='M7 10l5 5l5-5z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 10px center;
  background-size:16px 16px;
  padding-right:36px;
}

.field{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.field > span{ font-size:12px; color:var(--muted); }
.form-section{
  border:1px solid var(--border);
  border-radius:18px;
  padding:12px;
  background:linear-gradient(180deg, color-mix(in srgb, var(--surface-solid) 84%, transparent), color-mix(in srgb, var(--surface-solid) 96%, transparent));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.grid2{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; }
.row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.row.wrap{ flex-wrap:wrap; }
.checkbox{ width:18px; height:18px; accent-color:var(--primary); }
.hint, .tiny, .small, .muted{ color:var(--muted); }
.mono{ font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

.card-panel{
  border:1px solid var(--border-subtle);
  background:
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--bg-blob-1) 12%, transparent), transparent 52%),
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--bg-blob-3) 10%, transparent), transparent 50%),
    var(--surface-card);
  box-shadow:0 18px 46px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.08) inset;
}

.brand-header{
  position:sticky;
  top:0;
  z-index:40;
  padding:calc(6px + var(--safe-top)) calc(14px + var(--safe-right)) 6px calc(14px + var(--safe-left));
  background:
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--bg-blob-1) 22%, transparent), transparent 55%),
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--bg-blob-2) 18%, transparent), transparent 55%),
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--bg-blob-3) 12%, transparent), transparent 60%),
    linear-gradient(180deg, rgba(15,23,42,.80), rgba(15,23,42,.50));
  backdrop-filter:var(--glass);
  border-bottom:1px solid var(--border-subtle);
  box-shadow:0 18px 40px rgba(0,0,0,.35);
}

.brand{
  display:flex;
  align-items:center;
  gap:8px;
  position:relative;
  min-height:40px;
  font-weight:700;
  letter-spacing:.2px;
}

.brand-home-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:inherit;
  text-decoration:none;
  border-radius:14px;
  outline-offset:4px;
}
.brand-home-link:hover .brand-logo,
.brand-home-link:focus-visible .brand-logo{
  filter:drop-shadow(0 0 8px rgba(255,255,255,.45)) drop-shadow(0 0 22px color-mix(in srgb, var(--bg-blob-1) 48%, transparent));
}
.brand-home-link:focus-visible{
  outline:2px solid color-mix(in srgb, var(--accent) 70%, white);
}

.brand-logo{
  height:clamp(32px, 5vw, 48px);
  width:clamp(32px, 5vw, 48px);
  border-radius:10px;
  object-fit:contain;
  background:transparent;
  border:none;
}
.brand-logo.heat{
  filter:drop-shadow(0 0 6px rgba(255,255,255,.35)) drop-shadow(0 0 18px color-mix(in srgb, var(--bg-blob-1) 35%, transparent));
}
.brand-word{
  font-weight:800;
  font-size:clamp(1.6rem, 2.8vw, 2rem);
  letter-spacing:.2px;
}
.brand-neon{
  color:#eaf6ff;
  text-shadow:0 0 8px rgba(255,255,255,.22), 0 0 22px color-mix(in srgb, var(--bg-blob-1) 25%, transparent), 0 0 34px color-mix(in srgb, var(--bg-blob-3) 18%, transparent);
  animation:hue 12s linear infinite, glow 3.2s ease-in-out infinite;
}
@supports (-webkit-background-clip:text){
  .brand-neon{
    background:conic-gradient(from 90deg, var(--bg-blob-1), var(--bg-blob-2), var(--bg-blob-3), var(--bg-blob-4), var(--bg-blob-1));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
}
@keyframes hue{ from{ filter:hue-rotate(0); } to{ filter:hue-rotate(360deg); } }
@keyframes glow{ 0%,100%{ text-shadow:0 0 6px rgba(255,255,255,.22),0 0 14px color-mix(in srgb, var(--bg-blob-1) 28%, transparent);} 50%{ text-shadow:0 0 10px rgba(255,255,255,.42),0 0 24px color-mix(in srgb, var(--bg-blob-2) 34%, transparent);} }

.tagline{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  gap:2px;
  white-space:nowrap;
  pointer-events:none;
  text-align:center;
}
.glyph{ display:inline-block; line-height:1; transform-origin:center bottom; }
.tagline-iflexa{ animation:iflexFloat 6.4s ease-in-out infinite; }
@keyframes iflexFloat{ 0%,100%{ transform:translate(-50%,-50%) translateY(0);} 50%{ transform:translate(-50%,-50%) translateY(-2px);} }
.iflex-i,
.iflex-a{
  font-weight:900;
  font-size:1.62rem;
  color:#f8fbff;
  text-shadow:0 0 8px rgba(180,215,255,.55), 0 0 18px color-mix(in srgb, var(--bg-blob-1) 28%, transparent), 0 0 34px color-mix(in srgb, var(--bg-blob-2) 18%, transparent);
}
.iflex-flex{
  font-weight:900;
  font-size:1.58rem;
  background:linear-gradient(90deg, #ffb3d0, #ff72a7, #9ad8ff, #ffb3d0);
  background-size:200% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 10px color-mix(in srgb, var(--bg-blob-3) 25%, transparent)) drop-shadow(0 0 18px color-mix(in srgb, var(--bg-blob-1) 20%, transparent));
  animation:flexFlow 4.4s ease-in-out infinite;
}
@keyframes flexFlow{ 0%,100%{ background-position:0% 50%; transform:translateY(0);} 50%{ background-position:100% 50%; transform:translateY(-1px);} }

.quick-controls{ margin-left:auto; display:flex; gap:8px; align-items:center; }
.icon-button{
  border-radius:999px;
  border:1px solid var(--border-subtle);
  background:radial-gradient(circle at 30% 0%, rgba(255,255,255,.16), transparent 55%), linear-gradient(145deg, rgba(15,23,42,.90), rgba(15,23,42,.72));
  padding:6px 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 8px 22px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.10);
  transition:background .15s ease, border-color .15s ease, transform .08s ease, box-shadow .15s ease, filter .16s ease;
}
.icon-button:hover{
  background:radial-gradient(circle at 30% 0%, rgba(255,255,255,.22), transparent 55%), linear-gradient(145deg, color-mix(in srgb, var(--bg-blob-2) 18%, rgba(15,23,42,.92)), rgba(15,23,42,.72));
  border-color:color-mix(in srgb, var(--accent) 65%, white);
  box-shadow:0 10px 26px rgba(0,0,0,.48), 0 0 20px color-mix(in srgb, var(--bg-blob-1) 24%, transparent);
  transform:translateY(-1px);
  filter:brightness(1.03);
}
.icon-gear{
  width:18px; height:18px; border-radius:999px; border:2px solid color-mix(in srgb, var(--accent) 70%, white); box-shadow:0 0 0 1px rgba(15,23,42,.55); position:relative;
}
.icon-gear::before,
.icon-gear::after{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:999px;
  border:2px solid rgba(148,163,184,.75);
}
.icon-gear::after{ inset:7px; border-width:3px; border-color:color-mix(in srgb, var(--bg-blob-1) 65%, white); }

.settings-sheet{
  position:fixed;
  inset:0;
  display:none;
  align-items:flex-start;
  justify-content:flex-end;
  padding:calc(62px + var(--safe-top)) calc(12px + var(--safe-right)) calc(12px + var(--safe-bottom)) calc(12px + var(--safe-left));
  background:linear-gradient(to bottom, color-mix(in srgb, var(--bg-blob-2) 14%, rgba(15,23,42,.55)), transparent);
  pointer-events:none;
  z-index:45;
}
.settings-sheet.is-open{ display:flex; pointer-events:auto; }
.settings-card{
  width:min(320px, 100%);
  background:radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--bg-blob-1) 16%, transparent), transparent 55%), radial-gradient(circle at 120% 0%, color-mix(in srgb, var(--bg-blob-3) 14%, transparent), transparent 55%), var(--surface-card);
  border-radius:20px;
  border:1px solid var(--border-subtle);
  box-shadow:0 20px 60px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.12) inset;
  padding:14px 14px 12px;
  display:flex;
  flex-direction:column;
  gap:10px;
  backdrop-filter:var(--glass);
}
.settings-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding-bottom:4px;
  color:var(--text);
}
.settings-close{
  width:32px;
  height:32px;
  border-radius:999px;
  border:1px solid var(--border-subtle);
  background:linear-gradient(145deg, rgba(15,23,42,.88), rgba(15,23,42,.64));
  color:var(--text);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:1.25rem;
  line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
}
.settings-close:hover{
  border-color:color-mix(in srgb, var(--accent) 65%, white);
  background:linear-gradient(145deg, color-mix(in srgb, var(--bg-blob-2) 18%, rgba(15,23,42,.92)), rgba(15,23,42,.68));
}
.settings-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:.9rem; min-width:0; }
.settings-row label{ color:var(--muted); }
.settings-row .sel{ width:56%; min-width:150px; }
.settings-row-actions{ justify-content:flex-end; }

.app-main{
  position:relative;
  z-index:1;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
  border-radius:26px;
  margin:0 calc(10px + var(--safe-right)) 0 calc(10px + var(--safe-left));
  padding:16px calc(16px + var(--safe-right)) calc(24px + var(--safe-bottom)) calc(16px + var(--safe-left));
  background:
    radial-gradient(1200px 320px at 50% 0%, rgba(255,255,255,.10) 0%, transparent 70%),
    radial-gradient(140% 120% at 50% 50%, transparent 52%, rgba(0,0,0,.46) 100%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.06) 0 2px, transparent 2px 14px),
    repeating-linear-gradient(45deg, rgba(0,0,0,.22) 0 1px, transparent 1px 18px),
    radial-gradient(880px 680px at 16% 18%, color-mix(in srgb, var(--bg-blob-1) 16%, transparent) 0%, transparent 66%),
    radial-gradient(820px 660px at 88% 18%, color-mix(in srgb, var(--bg-blob-2) 16%, transparent) 0%, transparent 67%),
    radial-gradient(900px 680px at 76% 92%, color-mix(in srgb, var(--bg-blob-3) 14%, transparent) 0%, transparent 68%),
    radial-gradient(980px 720px at 20% 94%, color-mix(in srgb, var(--bg-blob-4) 12%, transparent) 0%, transparent 70%),
    linear-gradient(180deg, rgba(2,6,23,.88), rgba(2,6,23,.68));
  border:1px solid color-mix(in srgb, var(--border) 56%, rgba(255,255,255,.18));
  box-shadow:0 34px 95px rgba(0,0,0,.34), 0 0 0 1px rgba(255,255,255,.08) inset, 0 0 62px color-mix(in srgb, var(--bg-blob-2) 18%, transparent), 0 0 22px rgba(0,0,0,.45) inset;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb, var(--accent) 40%, transparent) transparent;
}
.app-main::-webkit-scrollbar{ width:12px; height:12px; }
.app-main::-webkit-scrollbar-track{ background:transparent; }
.app-main::-webkit-scrollbar-thumb{ background:color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.10)); border:3px solid transparent; border-radius:999px; background-clip:padding-box; }

.stage-shell.iflexa-shell{
  width:100%;
  min-height:100%;
  margin:0;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr);
  gap:var(--toolbar-gap);
  position:relative;
  z-index:1;
}

.toolbar-card{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  border-radius:22px;
  padding:16px 18px;
}
.toolbar-card-compact{ align-items:center; justify-content:flex-start; padding:14px 18px; }
.toolbar-actions{ display:flex; flex-wrap:wrap; gap:10px; align-self:center; }
.toolbar-actions-iflexa{ width:100%; }

.toolbar-menu{
  position:relative;
  display:inline-flex;
  align-items:center;
}
.toolbar-menu-toggle{
  white-space:nowrap;
}
.toolbar-dropdown{
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  z-index:80;
  min-width:150px;
  padding:8px;
  border:1px solid var(--border-subtle);
  border-radius:16px;
  background:
    radial-gradient(circle at 24% 0%, rgba(255,255,255,.16), transparent 58%),
    linear-gradient(145deg, rgba(15,23,42,.98), rgba(15,23,42,.88));
  box-shadow:0 18px 42px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:var(--glass);
}
.toolbar-dropdown-wide{ min-width:230px; }
.toolbar-dropdown-item{
  width:100%;
  border:0;
  border-radius:12px;
  background:transparent;
  color:var(--text);
  padding:9px 10px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  font:inherit;
  font-size:.88rem;
  font-weight:650;
  text-align:left;
  cursor:pointer;
}
.toolbar-dropdown-item:hover,
.toolbar-dropdown-item:focus-visible{
  outline:none;
  background:color-mix(in srgb, var(--brand) 20%, transparent);
}
.toolbar-dropdown-item.is-active,
.toolbar-dropdown-item[aria-checked="true"]{
  background:linear-gradient(145deg, color-mix(in srgb, var(--brand) 30%, transparent), color-mix(in srgb, var(--accent) 18%, transparent));
  color:var(--text);
}
.toolbar-dropdown-item:disabled,
.toolbar-dropdown-item[aria-disabled="true"]{
  opacity:.48;
  cursor:not-allowed;
  background:transparent;
}
.toolbar-dropdown-item:disabled:hover,
.toolbar-dropdown-item[aria-disabled="true"]:hover{
  background:transparent;
}

.stage{
  position:relative;
  min-height:520px;
  height:100%;
  overflow:hidden;
  border-radius:22px;
  padding:0;
  background:
    radial-gradient(900px 620px at 16% 12%, color-mix(in srgb, var(--bg-blob-1) 26%, transparent), transparent 62%),
    radial-gradient(820px 620px at 88% 8%, color-mix(in srgb, var(--bg-blob-2) 22%, transparent), transparent 64%),
    radial-gradient(920px 680px at 76% 92%, color-mix(in srgb, var(--bg-blob-3) 18%, transparent), transparent 68%),
    linear-gradient(135deg, color-mix(in srgb, var(--bg-g1) 82%, #020617 18%), var(--bg-g2) 58%, var(--bg-g3));
  background-size:auto;
  background-position:center;
}
.stage.grid-on{
  background:
    linear-gradient(to right, rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(120deg, var(--bg-g1), var(--bg-g2) 60%, var(--bg-g3));
  background-size:40px 40px, 40px 40px, auto;
}
#canvas-wrap{ position:relative; width:100%; height:100%; overflow:hidden; }
.board-title{
  position:absolute;
  top:12px;
  left:50%;
  transform:translateX(-50%);
  font-size:22px;
  font-weight:700;
  opacity:.88;
  z-index:2;
  pointer-events:none;
  text-align:center;
}

.legend{
  position:absolute;
  left:16px;
  right:16px;
  bottom:16px;
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:10px;
  border:1px solid var(--border);
  border-radius:14px;
  background:linear-gradient(180deg, color-mix(in srgb, var(--surface-solid) 86%, transparent), color-mix(in srgb, var(--surface-solid) 96%, transparent));
  box-shadow:var(--shadow);
  z-index:50;
}
.legend .row{ display:flex; flex-wrap:wrap; gap:6px; }
.legend .tag{ background:var(--chip); border:1px solid var(--border); color:var(--text); border-radius:999px; padding:4px 8px; font-size:12px; }

#board{ position:absolute; inset:0; width:100%; height:100%; }
#board text{ user-select:none; font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial; }
#board .link{ fill:none; stroke:var(--muted); stroke-width:1.6; marker-end:url(#arrow); }
#board .link[data-rel="adjunta"]{ stroke:var(--link-adjunta); }
#board .link[data-rel="involucra"]{ stroke:var(--link-involucra); }
#board .link[data-rel="atestigua"]{ stroke:var(--link-atestigua); }
#board .link[data-rel="ocurre_en"]{ stroke:var(--link-ocurre); }
#board .link[data-rel="conduce_a"]{ stroke:var(--link-conduce); }
#board .link[data-rel="relacionada_con"]{ stroke:var(--link-relacionada); }
#board .link[data-rel="reporta"]{ stroke:var(--link-reporta); }
#board .link[data-rel="afecta_a"]{ stroke:var(--link-afecta); }
#board .link[data-rel="asignado_a"]{ stroke:var(--link-asignado); }
#board .link[data-rel="deriva_de"]{ stroke:var(--link-deriva); }
#board .link[data-rel="duplica"]{ stroke:var(--link-duplica); }
#board .link[data-rel="menciona"]{ stroke:var(--link-menciona); }
#board .link[data-rel="evoca"]{ stroke:var(--link-evoca); }
#board .link[data-rel="simboliza"]{ stroke:var(--link-simboliza); }
#board .link[data-rel="sugiere"]{ stroke:var(--link-sugiere); }
#board .link[data-rel="desencadena"]{ stroke:var(--link-desencadena); }
#board .link[data-rel="predispone_a"]{ stroke:var(--link-predispone); }
#board .link[data-rel="confirma"]{ stroke:var(--link-confirma); }
#board .link[data-rel="refuta"]{ stroke:var(--link-refuta); }
#board .link[data-rel="requiere"]{ stroke:var(--link-requiere); }
#board .link-label{ font-size:10px; fill:#111827; paint-order:stroke; stroke:#ffffff; stroke-opacity:.8; stroke-width:3px; pointer-events:none; }

.node{ cursor:grab; }
.node:active{ cursor:grabbing; }
.node rect{ rx:12; ry:12; fill:#ffffff; stroke:var(--border); stroke-width:2.4; }
.node[data-type="caso"] rect{ stroke:var(--caso); }
.node[data-type="sueno"] rect{ stroke:var(--sueno); }
.node[data-type="intuicion"] rect{ stroke:var(--intuicion); }
.node[data-type="percepcion"] rect{ stroke:var(--percepcion); }
.node[data-type="sensacion"] rect{ stroke:var(--sensacion); }
.node[data-type="idea"] rect{ stroke:var(--idea); }
.node[data-type="propuesta"] rect{ stroke:var(--propuesta); }
.node[data-type="coincidencia"] rect{ stroke:var(--coincidencia); }
.node[data-type="curiosidad"] rect{ stroke:var(--curiosidad); }
.node[data-type="creencia"] rect{ stroke:var(--creencia); }
.node[data-type="experiencia"] rect{ stroke:var(--experiencia); }
.node[data-type="persona"] rect{ stroke:var(--persona); }
.node[data-type="animal"] rect{ stroke:var(--animal); }
.node[data-type="cosa"] rect{ stroke:var(--cosa); }
.node[data-type="emocion"] rect{ stroke:var(--emocion); }
.node[data-type="pensamiento"] rect{ stroke:var(--pensamiento); }
.node[data-type="recuerdo"] rect{ stroke:var(--recuerdo); }
.node[data-type="simbolo"] rect{ stroke:var(--simbolo); }
.node[data-type="metafora"] rect{ stroke:var(--metafora); }
.node[data-type="deseo"] rect{ stroke:var(--deseo); }
.node[data-type="miedo"] rect{ stroke:var(--miedo); }
.node[data-type="valor"] rect{ stroke:var(--valor); }
.node[data-type="necesidad"] rect{ stroke:var(--necesidad); }
.node[data-type="limite"] rect{ stroke:var(--limite); }
.node[data-type="habito"] rect{ stroke:var(--habito); }
.node[data-type="objetivo"] rect{ stroke:var(--objetivo); }
.node[data-type="agradecimiento"] rect{ stroke:var(--agradecimiento); }
.node[data-type="logro"] rect{ stroke:var(--logro); }
.node[data-type="duda"] rect{ stroke:var(--duda); }
.node[data-type="indicio"] rect{ stroke:var(--indicio); }
.node[data-type="contexto"] rect{ stroke:var(--contexto); }
.node[data-type="normativa"] rect{ stroke:var(--normativa); }
.node[data-type="incidente"] rect{ stroke:var(--incidente); }
.node[data-type="registro"] rect{ stroke:var(--registro); }
.node[data-type="patron"] rect{ stroke:var(--patron); }
.node[data-type="mitigacion"] rect{ stroke:var(--mitigacion); }
.node[data-type="detonante"] rect{ stroke:var(--detonante); }
.node[data-type="afectacion"] rect{ stroke:var(--afectacion); }
.node[data-type="vinculo"] rect{ stroke:var(--vinculo); }
.node[data-type="organizacion"] rect{ stroke:var(--organizacion); }
.node[data-type="cronologia"] rect{ stroke:var(--cronologia); }
.node[data-type="descargo"] rect{ stroke:var(--descargo); }
.node[data-type="posible_evidencia"] rect{ stroke:var(--posible_evidencia); }
.node[data-type="aporte"] rect{ stroke:var(--aporte); }
.node[data-type="implicado"] rect{ stroke:var(--implicado); }
.node[data-type="testigo"] rect{ stroke:var(--testigo); }
.node[data-type="categoria"] rect{ stroke:var(--categoria); }
.node[data-type="area"] rect{ stroke:var(--area); }
.node .title{ font-weight:800; font-size:13px; fill:#111827; }
.node .title .emoji{ font-size:18px; }
.node .subtitle{ font-size:12px; fill:#374151; }
.node .tags{ font-size:11px; fill:#6b7280; }
.node .chip-plus{ cursor:pointer; }
.node .plus-bg{ fill:var(--chip); stroke:var(--border); }
.node .plus-t{ fill:#fff; font-weight:900; font-size:14px; }
.node .fo-desc{ font:11px/1.35 system-ui,-apple-system,Segoe UI,Roboto,Arial; color:#0c0c14; white-space:pre-wrap; word-break:break-word; overflow-wrap:anywhere; box-sizing:border-box; padding-bottom:8px; overflow:visible; }
.node .fo-desc img.fo-thumb{ float:right; width:96px; height:96px; object-fit:cover; margin-left:8px; margin-bottom:6px; border:1px solid var(--border); border-radius:6px; }
.node .fo-meta{ margin-top:6px; font-size:11px; line-height:1.35; }
.node .fo-meta .kv{ margin:2px 0; }
.node .fo-meta b{ font-weight:800; }

.floating-panel{
  position:absolute;
  border:1px solid var(--border);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(15,23,42,.95), rgba(15,23,42,.82));
  box-shadow:var(--shadow);
  z-index:80;
  max-width:calc(100% - 24px);
}
.float-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:10px 12px;
  border-bottom:1px solid color-mix(in srgb, var(--border) 80%, transparent);
  cursor:move;
  user-select:none;
  touch-action:none;
}
.float-title{ font-weight:700; }

.control-panel{ left:18px; top:18px; width:min(640px, calc(100% - 36px)); }
.cp-body{ padding:10px; display:flex; flex-direction:column; gap:12px; }
.cp-group{
  background:linear-gradient(180deg, color-mix(in srgb, var(--surface-solid) 92%, transparent), transparent);
  border:1px solid color-mix(in srgb, var(--border) 80%, var(--brand) 20%);
  border-radius:16px;
  padding:10px;
}
.cp-group > label{ display:block; font-weight:700; letter-spacing:.2px; color:var(--muted); margin-bottom:8px; font-size:12px; }
.cp-group .btn,
.cp-group .sel-compact{ min-height:34px; }
.sel-compact{ min-width:140px; }
.row.seg{
  display:inline-flex;
  border:1px solid var(--border);
  border-radius:10px;
  overflow:hidden;
  background:linear-gradient(180deg, color-mix(in srgb, var(--chip) 60%, transparent), color-mix(in srgb, var(--chip) 92%, transparent));
}
.row.seg .btn{ background:transparent; border:none; border-radius:0; min-width:96px; box-shadow:none; }
.row.seg .btn + .btn{ border-left:1px solid var(--border); }
.row.seg .btn.active{ background:linear-gradient(180deg, color-mix(in srgb, var(--brand) 22%, transparent), color-mix(in srgb, var(--chip) 90%, transparent)); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--brand) 45%, var(--border)); }
.cp-rel .row{ flex-wrap:nowrap; align-items:center; gap:10px; }
.cp-rel .sel-wrap{ position:relative; }
.cp-rel .sel-wrap .emj{ position:absolute; left:10px; top:50%; transform:translateY(-50%); font-size:18px; pointer-events:none; opacity:.95; }
.cp-rel .sel-wrap .sel-compact{ width:100%; padding-left:36px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cp-rel .sel-wrap.a{ flex:0 0 160px; min-width:160px; max-width:160px; }
.cp-rel .sel-wrap.t{ flex:0 0 172px; min-width:172px; max-width:172px; }
.cp-rel .sel-wrap.b{ flex:0 0 160px; min-width:160px; max-width:160px; }
.cp-rel #btnRelate{ flex:0 0 64px; }

.manage-panel{ left:22px; top:140px; width:min(680px, 96vw); max-height:calc(100% - 180px); overflow:hidden; }
.manage-body{ padding:10px; overflow:hidden; max-height:calc(100% - 46px); }
.manage-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; }
.manage-col{ display:flex; flex-direction:column; gap:8px; min-width:0; }
.manage-col-header{ font-weight:700; font-size:13px; color:var(--text); opacity:.95; }
.manage-list{ display:flex; flex-direction:column; gap:8px; max-height:336px; overflow:auto; padding-right:2px; }
.manage-item{ border:1px solid var(--border); border-radius:12px; padding:8px 10px; display:flex; justify-content:space-between; align-items:center; gap:8px; background:linear-gradient(180deg, rgba(23,24,39,.96), rgba(23,24,39,.88)); min-height:48px; }
.manage-text{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.manage-meta{ font-size:12px; color:var(--muted); }

.cards-panel{ width:clamp(680px, 72vw, 1120px); max-height:min(74svh, calc(100% - 40px)); overflow:hidden; left:50%; transform:translateX(-50%); top:18px; }
.cards-body{ padding:10px; overflow:auto; max-height:calc(100% - 46px); display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; }
.card{ border:1px solid var(--border); border-radius:12px; padding:10px; background:linear-gradient(180deg, rgba(23,24,39,.96), rgba(23,24,39,.88)); display:flex; gap:10px; align-items:flex-start; position:relative; }
.card .info{ min-width:0; flex:1; }
.card .title{ font-weight:800; font-size:13px; margin-bottom:2px; }
.card .meta{ font-size:12px; color:var(--muted); margin-bottom:6px; }
.card .desc{ font-size:12px; opacity:.95; white-space:pre-wrap; }
.card .kvlist{ margin-top:6px; font-size:12px; line-height:1.35; white-space:pre-wrap; word-break:break-word; overflow-wrap:anywhere; }
.card .kvlist .kv{ margin:2px 0; }
.card .kvlist b{ font-weight:800; }
.card .expand-btn{ position:absolute; right:8px; top:8px; }

.minimap-panel{ right:16px; width:220px; }
.minimap-panel canvas{ display:block; width:100%; height:auto; }

.filter-panel{ top:18px; width:min(960px, calc(100% - 42px)); }
.filter-body{ padding:10px; max-height:min(74svh, calc(100% - 40px)); overflow:hidden; }
.filter-tools{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.filter-list{ border:1px solid var(--border); border-radius:12px; overflow:auto; max-height:calc(74svh - 62px); background:rgba(15,23,42,.62); }
.filter-row{ display:grid; grid-template-columns:1fr 120px 160px 120px 120px 120px; gap:8px; align-items:center; padding:8px; border-bottom:1px solid var(--border); }
.filter-row.header{ position:sticky; top:0; background:color-mix(in srgb, var(--surface) 96%, transparent); font-weight:700; }
.filter-row .t{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.filter-row .btn{ justify-self:end; }

.coherent-panel{ width:min(480px, calc(100% - 40px)); top:18px; right:16px; }
.coherent-body{ padding:10px 12px 14px; max-height:360px; overflow:auto; }
.coh-row{ border:1px solid var(--border); border-radius:12px; padding:8px 10px; background:rgba(15,23,42,.65); margin-bottom:8px; }
.coh-row .h{ font-weight:800; margin-bottom:4px; }
.coh-row .m{ color:var(--muted); margin-bottom:2px; }

.media5{ display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:10px; }
.media-col{ display:flex; flex-direction:column; gap:6px; }
.media-head{ font-size:12px; color:var(--muted); font-weight:700; }
.media-select{ min-width:100%; }
.media-preview img,
.media-preview video{ width:100%; max-height:96px; object-fit:contain; border:1px solid var(--border); border-radius:8px; cursor:zoom-in; }
.media-preview audio{ width:100%; }

.tags-input{ display:flex; gap:6px; flex-wrap:wrap; padding:6px; border:1px dashed var(--border); border-radius:10px; min-height:44px; }
.tags-input input{ border:none; background:transparent; outline:none; flex:1; color:var(--text); min-width:120px; }
.tag-chip{ background:var(--chip); border:1px solid var(--border); color:var(--text); border-radius:999px; padding:4px 8px; font-size:12px; display:inline-flex; gap:6px; align-items:center; }
.tag-chip .x{ background:transparent; border:none; color:var(--muted); cursor:pointer; }

.sheet-head{ display:flex; align-items:center; gap:12px; padding:12px; margin:-14px -14px 12px; border-bottom:1px solid var(--border); background:linear-gradient(180deg, color-mix(in srgb, var(--surface) 92%, transparent), transparent); }
.sheet-head .avatar{ width:40px; height:40px; border-radius:8px; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; background:var(--chip); font-size:20px; }
.sheet-head .head-main h2{ margin:0 0 4px; font-size:16px; font-weight:800; }
.idline{ font-size:12px; color:var(--muted); }

.head-main{
  min-width:0;
  flex:1;
}
.node-title-row{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  flex-wrap:wrap;
}
.node-title-row h2{
  flex:0 1 auto;
}
.node-tabs{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:4px;
  border:1px solid color-mix(in srgb, var(--border) 78%, transparent);
  border-radius:999px;
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.12), transparent 55%),
    linear-gradient(145deg, rgba(15,23,42,.82), rgba(15,23,42,.58));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.node-tab{
  border:0;
  border-radius:999px;
  padding:6px 12px;
  min-height:30px;
  color:var(--muted);
  background:transparent;
  font-weight:800;
  font-size:12px;
  letter-spacing:.15px;
  cursor:pointer;
  transition:background .16s ease, color .16s ease, box-shadow .16s ease, transform .08s ease;
}
.node-tab:hover{
  color:var(--text);
  background:color-mix(in srgb, var(--brand) 12%, transparent);
}
.node-tab.active{
  color:var(--text);
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.22), transparent 56%),
    linear-gradient(145deg, color-mix(in srgb, var(--brand) 46%, rgba(15,23,42,.92)), color-mix(in srgb, var(--accent) 28%, rgba(15,23,42,.74)));
  box-shadow:0 8px 20px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.16);
}
.node-tab:focus-visible{
  outline:2px solid color-mix(in srgb, var(--accent) 70%, white);
  outline-offset:2px;
}
.node-tab-panel{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.node-tab-panel[hidden]{
  display:none !important;
}
.node-tab-panel .form-section{
  margin:0;
}

#nodeDialog,
#caseDialog,
#dlgMIT,
#dlgPrivacy,
#dlgUniversalCoherence,
#mediaViewer{
  border:none;
  padding:0;
  background:transparent;
  color:var(--text);
}
#nodeDialog::backdrop,
#caseDialog::backdrop,
#dlgMIT::backdrop,
#dlgPrivacy::backdrop,
#dlgUniversalCoherence::backdrop,
#mediaViewer::backdrop{ background:rgba(0,0,0,.55); backdrop-filter:blur(2px); }
#nodeDialog{
  width:clamp(680px, 72vw, 1020px);
  max-height:calc(100svh - var(--header-h) - 20px);
  margin:calc(var(--header-h) + 8px) auto 12px;
  overflow:hidden;
}
#nodeDialog form,
#caseDialog form,
#dlgMIT form,
#dlgPrivacy form,
#dlgUniversalCoherence form{
  background:radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--bg-blob-1) 16%, transparent), transparent 55%), radial-gradient(circle at 120% 0%, color-mix(in srgb, var(--bg-blob-3) 14%, transparent), transparent 55%), var(--surface-card);
  border:1px solid var(--border-subtle);
  border-radius:20px;
  padding:14px;
  box-shadow:0 20px 60px rgba(0,0,0,.55);
}
#nodeDialog form{ max-height:inherit; overflow:auto; }
#caseDialog form,
#dlgMIT form,
#dlgPrivacy form,
#dlgUniversalCoherence form{ width:min(760px, 92vw); }
#mediaViewer{ width:min(82vw, 1080px); }
#mediaViewer #viewerContent{ background:linear-gradient(180deg, rgba(15,23,42,.95), rgba(15,23,42,.82)); border:1px solid var(--border); border-radius:18px; }
dialog menu{ display:flex; justify-content:flex-end; gap:8px; margin:12px 0 0; padding:0; }

.universal-coherence-section{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:14px;
}
.universal-coherence-icon{
  width:72px;
  height:72px;
  object-fit:contain;
  border-radius:18px;
  filter:drop-shadow(0 0 10px color-mix(in srgb, var(--accent) 38%, transparent));
}
.universal-coherence-section p{
  margin:0;
  line-height:1.55;
  color:var(--text);
  font-weight:650;
}
@media (max-width: 560px){
  .universal-coherence-section{ grid-template-columns:1fr; text-align:center; justify-items:center; }
}

.brand-footer{
  background:radial-gradient(circle at 0% 100%, color-mix(in srgb, var(--bg-blob-1) 16%, transparent), transparent 55%), radial-gradient(circle at 100% 100%, color-mix(in srgb, var(--bg-blob-2) 14%, transparent), transparent 55%), linear-gradient(0deg, rgba(15,23,42,.80), rgba(15,23,42,.50));
  border-top:1px solid var(--border-subtle);
  padding:4px calc(12px + var(--safe-right)) calc(4px + var(--safe-bottom)) calc(12px + var(--safe-left));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:var(--muted);
  box-shadow:0 -14px 32px rgba(0,0,0,.35);
  position:relative;
  z-index:40;
  backdrop-filter:var(--glass);
}
.brand-footer strong{ color:var(--text); }
.brand-footer .sep{ opacity:.6; }
.footer-author-link{
  color:#d4a017;
  font-weight:800;
  text-decoration:none;
  text-underline-offset:3px;
  transition:color .16s ease, text-shadow .16s ease;
}
.footer-author-link:hover,
.footer-author-link:focus-visible{
  color:#f2c94c;
  text-decoration:underline;
  text-shadow:0 0 12px color-mix(in srgb, #d4a017 42%, transparent);
}
.footer-author-link:focus-visible{
  outline:2px solid color-mix(in srgb, #d4a017 70%, white);
  outline-offset:3px;
  border-radius:6px;
}
.footer-left{ display:flex; flex-direction:column; gap:2px; font-size:.78rem; min-width:0; }
.f-left-row1,
.f-left-row2{ display:flex; align-items:center; gap:4px; flex-wrap:wrap; min-width:0; }
#footerAppName{ display:inline-flex; min-width:0; max-width:100%; white-space:normal; }
.footer-center{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); }
.footer-right{ display:flex; align-items:center; gap:clamp(8px, 2vw, 18px); }
.footer-logo-btn{
  display:inline-grid;
  place-items:center;
  padding:0;
  border-radius:50%;
  border:1px solid transparent;
  background:transparent;
  cursor:pointer;
  transition:box-shadow .14s ease, transform .08s ease, filter .14s ease, border-color .12s ease, background-color .12s ease;
  box-shadow:none;
}
.footer-logo-btn:hover,
.footer-logo-btn:focus-visible{
  background:radial-gradient(circle at 20% 0%, rgba(255,255,255,.16), transparent 55%), linear-gradient(145deg, rgba(15,23,42,.88), rgba(15,23,42,.70));
  border-color:color-mix(in srgb, var(--accent) 60%, white);
  box-shadow:0 8px 24px rgba(0,0,0,.40), inset 0 1px 0 rgba(255,255,255,.10);
}
.footer-logo-btn:active{ transform:scale(.97); }
.footer-logo{ height:clamp(28px, 6vw, 36px); width:clamp(28px, 6vw, 36px); object-fit:contain; border-radius:10px; }
.tag-logo{ object-fit:contain; transform-origin:center center; animation:sway 6.2s ease-in-out infinite; filter:drop-shadow(0 0 6px rgba(255,255,255,.30)) drop-shadow(0 0 18px color-mix(in srgb, var(--bg-blob-1) 34%, transparent)) drop-shadow(0 0 30px color-mix(in srgb, var(--bg-blob-3) 18%, transparent)); }
@keyframes sway{ 0%{transform:rotate(-3deg);} 50%{transform:rotate(3deg);} 100%{transform:rotate(-3deg);} }

[data-theme="original"]{
  --bg:#b4a9a99a; --surface:#18191dee; --surface-solid:#18191d; --text:#e5e7eb; --muted:#94a3b8;
  --brand:#22d3ee; --accent:#a78bfa; --ok:#34d399; --danger:#f43f5ecc; --warn:#f59e0bcc; --chip:#464e5a; --border:#2c6e48;
  --bg-g1:#b4a9a99a; --bg-g2:#1e1935e3; --bg-g3:#1d1235; --card-g1:#3d4250; --card-g2:#414044c2; --card-g3:#797c81;
}
[data-theme="bosque"]{
  --bg:#0b1f17; --surface:#13261aee; --surface-solid:#13261a; --text:#e7f6ec; --muted:#9fb7a6;
  --brand:#34d399; --accent:#a3e635; --danger:#ef4444cc; --warn:#f59e0bcc; --chip:#1f3b2b; --border:#2e7d32;
  --bg-g1:#0b1f17; --bg-g2:#0e2e1f; --bg-g3:#143729; --card-g1:#173a2b; --card-g2:#1c4a33c2; --card-g3:#315a46;
}
[data-theme="atardecer"]{
  --bg:#3b0a2a; --surface:#201022ee; --surface-solid:#201022; --text:#ffecf5; --muted:#f5c2d0;
  --brand:#f472b6; --accent:#fb923c; --ok:#f59e0b; --danger:#ef4444cc; --warn:#f97316cc; --chip:#4c1d2f; --border:#b91c1c;
  --bg-g1:#4b1130; --bg-g2:#6a1b3ae3; --bg-g3:#ff6a00; --card-g1:#5a2b44; --card-g2:#703a4cc2; --card-g3:#b76a3a;
}
[data-theme="cyber"]{
  --bg:#001a2b; --surface:#0a1420ee; --surface-solid:#0a1420; --text:#dff7ff; --muted:#8fd3e6;
  --brand:#22d3ee; --accent:#a78bfa; --ok:#34d399; --danger:#f43f5ecc; --warn:#f59e0bcc; --chip:#0e2738; --border:#1f6aa3;
  --bg-g1:#001422; --bg-g2:#002f4be3; --bg-g3:#041d35; --card-g1:#0c2c47; --card-g2:#10395ac2; --card-g3:#2a6a93;
}

@media (max-width:1200px){
  .cards-body{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:1100px){ .media5{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:1024px){
  .toolbar-card{ flex-direction:column; align-items:stretch; }
  .toolbar-card-compact{ justify-content:flex-start; }
  .toolbar-actions{ justify-content:flex-start; }
  .cards-panel{ width:min(96vw, 1120px); }
  .cards-body{ grid-template-columns:1fr; }
}
@media (max-width:880px){
  .grid2{ grid-template-columns:1fr; }
  .cp-rel .row{ flex-wrap:wrap; }
  .cp-rel .sel-wrap.a,
  .cp-rel .sel-wrap.t,
  .cp-rel .sel-wrap.b,
  .cp-rel #btnRelate{ flex:1 1 100%; min-width:0; max-width:none; }
}
@media (max-width:720px){
  .node-title-row{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }
  .node-tabs{
    width:100%;
  }
  .node-tab{
    flex:1;
  }
}

@media (max-width:680px){
  .brand-header{ padding-left:calc(10px + var(--safe-left)); padding-right:calc(10px + var(--safe-right)); }
  .brand-logo{ width:42px; height:42px; }
  .tagline{ max-width:calc(100% - 124px); }
  .iflex-i, .iflex-a{ font-size:1.34rem; }
  .iflex-flex{ font-size:1.3rem; }
  .app-main{ padding:12px calc(12px + var(--safe-right)) calc(20px + var(--safe-bottom)) calc(12px + var(--safe-left)); }
  .toolbar-card, .stage{ padding:14px; border-radius:20px; }
  .stage{ padding:0; }
  .toolbar-actions .btn{ width:100%; }
  .toolbar-menu{ width:100%; display:flex; flex-direction:column; align-items:stretch; }
  .toolbar-dropdown{ position:static; width:100%; margin-top:8px; }
  .control-panel, .filter-panel, .coherent-panel{ width:calc(100% - 20px); left:10px !important; right:10px !important; }
  .manage-panel, .cards-panel{ width:calc(100% - 20px); left:10px !important; right:10px !important; transform:none !important; }
}
@media (max-width:600px) and (orientation:portrait){
  .brand-footer{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding-left:calc(10px + var(--safe-left)); padding-right:calc(10px + var(--safe-right)); column-gap:8px; }
  .footer-left{ justify-self:flex-start; text-align:left; }
  .f-left-row1{ display:grid; grid-template-columns:1fr; gap:0; align-items:start; }
  .f-left-row1 .sep{ display:none; }
  #footerAppName{ display:block; overflow-wrap:anywhere; }
  .footer-center{ position:static; transform:none; justify-self:center; }
  .footer-right{ justify-self:flex-end; display:flex; flex-direction:column; align-items:flex-end; gap:4px; }
  .footer-logo-btn{ padding:2px; }
  .footer-logo{ height:clamp(76px, 22vw, 108px); width:clamp(76px, 22vw, 108px); }
}
@media (prefers-reduced-motion: reduce){
  body::before,
  .brand-neon,
  .tagline-iflexa,
  .tag-logo,
  .iflex-flex,
  .iflex-i,
  .iflex-a{ animation:none !important; }
  .btn,
  .icon-button,
  .footer-logo-btn,
  .brand-logo,
  .node,
  .tag-chip{ transition:none !important; }
  .btn:hover,
  .icon-button:hover,
  .footer-logo-btn:hover{ transform:none; }
}
