/* ============================================================
   ADMINISTRADOR DE PROCESOS · UMG
   Identidad: el escritorio de la secretaría. Papel frío, tinta azul
   del sello UMG, documentos que reciben sellos y un autómata que
   decide cada paso. Títulos en Bricolage Grotesque; interfaz en
   IBM Plex Sans; notación formal (δ, códigos, rutas) en Plex Mono.
   Todas las fuentes van incluidas (licencia OFL): funciona sin internet.
   ============================================================ */
@font-face { font-family: "Bricolage Grotesque"; font-weight: 600; font-display: swap; src: url("fonts/bricolage-600.woff2") format("woff2"); }
@font-face { font-family: "Bricolage Grotesque"; font-weight: 700; font-display: swap; src: url("fonts/bricolage-700.woff2") format("woff2"); }
@font-face { font-family: "Bricolage Grotesque"; font-weight: 800; font-display: swap; src: url("fonts/bricolage-800.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 400; font-display: swap; src: url("fonts/plex-sans-400.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 500; font-display: swap; src: url("fonts/plex-sans-500.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 600; font-display: swap; src: url("fonts/plex-sans-600.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 700; font-display: swap; src: url("fonts/plex-sans-700.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-weight: 400; font-display: swap; src: url("fonts/plex-mono-400.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-weight: 500; font-display: swap; src: url("fonts/plex-mono-500.woff2") format("woff2"); }

/* Layout: barra superior azul con secciones; debajo, la hoja principal y una
   columna contextual (actividad, recorrido previsto o editor de flujos). */
:root {
  /* Superficies y tinta (claro) */
  --bg: #eef1f5; --surface: #ffffff; --surface-2: #f4f6f9; --surface-3: #e8edf3;
  --line: #dde3ea; --line-2: #c6cfda;
  --ink: #13202f; --ink-2: #44516a; --muted: #5b667c;
  /* Identidad UMG */
  --accent: #1d6fa5; --accent-ink: #ffffff;
  --barra: #10304f; --barra-2: #183f66; --barra-ink: #ffffff; --barra-tenue: #c3cfdd;
  --oro: #b8892f;
  --primario: #13202f; --primario-ink: #ffffff; --primario-hover: #22344a;
  --lamina: #f7f9fb; --punto: #d3dae3;
  --toast-bg: #13202f; --toast-ink: #ffffff;
  --peligro: #c62f35; --peligro-soft: #fdecec;
  --exito: #16794a;
  --serie-1: #1d6fa5; --serie-2: #b07f1f;
  --sombra: 0 1px 2px rgba(19,32,47,.05), 0 12px 32px -16px rgba(19,32,47,.16);
  --sombra-alta: 0 30px 70px -24px rgba(19,32,47,.42);
  /* Tipografía */
  --f-titulo: "Bricolage Grotesque", "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --f-texto: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, Consolas, Menlo, monospace;
  /* Forma */
  --r-hoja: 22px; --r-caja: 16px; --r-ctrl: 11px;
  /* Movimiento (Emil Kowalski): curvas propias y duraciones compartidas */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --dur-pulsar: 140ms; --dur-ui: 200ms; --dur-entrada: 260ms;
  color-scheme: light;
}
:root[data-theme="dark"] {
  --bg: #0b1119; --surface: #131c27; --surface-2: #19242f; --surface-3: #213040;
  --line: #243344; --line-2: #33465b;
  --ink: #e6edf5; --ink-2: #a9b5c6; --muted: #8f9bb0;
  --accent: #64a6dc; --accent-ink: #0b1119;
  --barra: #0d1a29; --barra-2: #16293f; --barra-ink: #e6edf5; --barra-tenue: #b3c0d0;
  --oro: #d4a548;
  --primario: #e6edf5; --primario-ink: #0b1119; --primario-hover: #ffffff;
  --lamina: #0f1822; --punto: #233244;
  --toast-bg: #e6edf5; --toast-ink: #0b1119;
  --peligro: #ff8f94; --peligro-soft: #3a1719;
  --exito: #6fd59e;
  --serie-1: #4f95cf; --serie-2: #b8892f;
  --sombra: 0 1px 2px rgba(0,0,0,.4), 0 12px 32px -14px rgba(0,0,0,.6);
  --sombra-alta: 0 30px 70px -24px rgba(0,0,0,.8);
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --bg: #0b1119; --surface: #131c27; --surface-2: #19242f; --surface-3: #213040;
  --line: #243344; --line-2: #33465b;
  --ink: #e6edf5; --ink-2: #a9b5c6; --muted: #8f9bb0;
  --accent: #64a6dc; --accent-ink: #0b1119;
  --barra: #0d1a29; --barra-2: #16293f; --barra-ink: #e6edf5; --barra-tenue: #b3c0d0;
  --oro: #d4a548;
  --primario: #e6edf5; --primario-ink: #0b1119; --primario-hover: #ffffff;
  --lamina: #0f1822; --punto: #233244;
  --toast-bg: #e6edf5; --toast-ink: #0b1119;
  --peligro: #ff8f94; --peligro-soft: #3a1719;
  --exito: #6fd59e;
  --serie-1: #4f95cf; --serie-2: #b8892f;
  --sombra: 0 1px 2px rgba(0,0,0,.4), 0 12px 32px -14px rgba(0,0,0,.6);
  --sombra-alta: 0 30px 70px -24px rgba(0,0,0,.8);
  color-scheme: dark;
} }


/* Reference adaptation: cosasperdidas.shop. No source logo or institutional identity. */
:root{--field:var(--surface-2);font-family:var(--f-texto)}:root[data-theme=dark]{--field:var(--surface-2)}
body{font:15px/1.5 var(--f-texto);color:var(--ink);background:var(--bg)}button,input,select,textarea{font-family:var(--f-texto)}
h1,h2,.brand strong{font-family:var(--f-titulo);font-weight:700;letter-spacing:-.02em;line-height:1.12}.page-head h1{font-size:36px}.page-head p{font-size:14.5px;color:var(--ink-2);line-height:1.55}.panel-title h3,h3{font-size:15px;font-weight:600}.eyebrow{font-size:13px;font-weight:500;letter-spacing:0;color:var(--ink-2);text-transform:none}.btn{font-size:13.5px;font-weight:600;padding:10px 15px;border-radius:11px;background:var(--surface-2);border:1px solid var(--line);color:var(--ink);transition:border-color 200ms,background-color 200ms,color 200ms,box-shadow 200ms,transform 140ms var(--ease-out)}.btn:hover{background:var(--surface-3);transform:none;box-shadow:none}.btn:active,.request-tile:active{transform:scale(.97)}.btn.primary{background:var(--primario);color:var(--primario-ink);border-color:var(--primario);box-shadow:none}.btn.primary:hover{background:var(--primario-hover)}
.sidebar,.topbar{background:var(--barra);color:var(--barra-ink);border-color:var(--barra-2)}.top-actions .btn{background:transparent;border-color:#ffffff26;color:var(--barra-tenue);font-size:13px}.top-actions .btn:hover{background:#ffffff12;color:var(--barra-ink)}.brand strong{font-size:17px}.brand-mark{background:var(--barra-2);color:white;box-shadow:none;font-size:15px;border:1px solid #ffffff28}.brand small{color:var(--barra-tenue);font-size:10px}.nav-item{font-size:13.5px;font-weight:600;color:var(--barra-tenue);transition:color 200ms,background-color 200ms,transform 140ms var(--ease-out)}.nav-item:hover{background:#ffffff12;transform:none;color:var(--barra-ink)}.nav-item.active{background:var(--surface);color:var(--ink)}.workspace-pill,.sidebar-help{background:var(--barra-2);border-color:#ffffff18}.workspace-text small,.side-user small,.sidebar-help small,.sidebar-help b{color:var(--barra-tenue)}.nav-section-caption{color:var(--barra-tenue)}
.main-content{padding-top:32px}.metric,.panel,.request-tile{background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--sombra)}.panel{border-radius:22px}.metric:hover,.panel:hover{box-shadow:var(--sombra)}.metric:hover{transform:none}.metric h2{font-size:34px}.metric-top span:first-child{font-size:13px;color:var(--ink-2)}.metric-foot{font-size:12.5px}.request-tile{transition:transform 220ms var(--ease-out),box-shadow 220ms,border-color 220ms;min-height:160px}.request-tile:hover{transform:translateY(-2px);border-color:var(--line-2);box-shadow:var(--sombra)}.request-tile strong{font-size:14px;font-weight:600}.request-tile small{font-size:12.5px;color:var(--muted)}.request-tile .tile-symbol{background:color-mix(in srgb,var(--accent) 12%,var(--surface));color:var(--accent)}
.feature-hero{background:var(--lamina);color:var(--ink);border:1px solid var(--line);border-left:3px solid var(--oro);border-radius:16px;box-shadow:none}.feature-hero:after{display:none}.feature-hero h2{font-size:23px}.feature-hero p{font-size:14px;color:var(--ink-2)}.feature-hero .eyebrow{color:var(--muted)}.feature-hero .btn{background:var(--surface-2);border:1px solid var(--line);color:var(--ink)}
.panel-desc,.fineprint,.setting-row p,.form-intro{font-size:12.5px}.form-field label{font-size:12px;font-weight:600;color:var(--muted)}.form-field input,.form-field textarea,.form-field select{font-size:14px;background:var(--surface);border-color:var(--line);border-radius:11px;transition:border-color 200ms,box-shadow 200ms}.form-field input:focus,.form-field textarea:focus,.form-field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}.form-field small{font-size:12px}.search-field input,.filter-row select{font-size:14px}td{font-size:13.5px;color:var(--ink-2)}th{font-size:11.5px}.skeleton-note{font:12px var(--f-mono)}.status{font-size:11px}.warning-line{background:color-mix(in srgb,var(--oro) 12%,var(--surface));color:var(--ink-2);border-color:color-mix(in srgb,var(--oro) 35%,var(--line));font-size:12.5px}.info-callout,.form-intro{background:var(--surface-2);color:var(--ink-2)}.modal,.modal-head{background:var(--surface)}.modal{animation:referenceModal 240ms var(--ease-out) both;box-shadow:var(--sombra-alta)}.modal-head h2{font-size:23px}.toast{background:var(--toast-bg);color:var(--toast-ink);animation:referenceRise 260ms var(--ease-out) both}.mini-bar{background:var(--accent);animation:barRise 600ms var(--ease-out) both}.tag-blue{background:var(--surface-3);color:var(--ink-2)}
.login-layout{max-width:none;min-height:100vh;padding:0;gap:0;grid-template-columns:1fr 1fr;align-items:stretch}.login-story{background:radial-gradient(ellipse at 10% 0%,#1d507d 0%,transparent 55%),radial-gradient(ellipse at 100% 100%,#292248 0%,transparent 45%),#0e2842;color:#fff;padding:10vh 9%;display:flex;flex-direction:column;justify-content:center;min-height:100vh}.login-story .eyebrow,.login-story>small{color:#c3cfdd}.login-story h1{font-size:36px;letter-spacing:-.02em;line-height:1.12}.login-story>p{font-size:21px;color:#c3cfdd;line-height:1.4}.login-art{border:1px solid #ffffff24;background:#ffffff05;padding:28px;border-radius:16px;margin:28px 0}.login-art h2{font-size:23px;font-weight:700;line-height:1.25}.login-art span{font:12.5px var(--f-mono);color:#d4a548}.login-art small{font:10px var(--f-mono);color:#c3cfdd;line-height:1.6}.login-card{padding:10vh max(30px,13%);display:flex;flex-direction:column;justify-content:center;border:0;border-left:1px solid var(--line);border-radius:0;box-shadow:none;background:var(--surface)}.login-card>h2{font-size:34px}.login-card>p{font-size:14.5px;color:var(--ink-2)}.login-card>.btn{align-self:flex-end}.login-card form>*{animation:referenceRise 360ms var(--ease-out) both}.login-card form>*:nth-child(2){animation-delay:60ms}.login-card .segmented{background:var(--surface-2);border-color:var(--line);padding:5px;gap:4px}.segmented button{font-size:13.5px;padding:10px 15px;color:var(--ink-2);transition:background-color 200ms,color 200ms,transform 140ms var(--ease-out)}.segmented button.selected{background:color-mix(in srgb,var(--accent) 10%,var(--surface));color:var(--ink);box-shadow:0 0 0 1px var(--accent)}.login-card input{font-size:14px}.login-card form .btn{min-height:46px}.login-card .fineprint{font-size:12.5px}
@keyframes referenceRise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes referenceModal{from{opacity:0;transform:scale(.96) translateY(8px)}to{opacity:1;transform:none}}
#main{animation:referenceRise 260ms var(--ease-out) both}#main>.metrics>.metric{animation:referenceRise 260ms var(--ease-out) both}#main>.metrics>.metric:nth-child(2){animation-delay:30ms}#main>.metrics>.metric:nth-child(3){animation-delay:60ms}#main>.metrics>.metric:nth-child(4){animation-delay:90ms}
@media(max-width:1100px){.top-actions{gap:5px}.top-actions .btn{font-size:12px;padding:8px 10px}.login-card{padding:40px}.login-story{padding:50px 30px}}@media(max-width:790px){.page-head h1{font-size:30px}.login-layout{grid-template-columns:1fr}.login-story{min-height:auto;padding:32px 24px}.login-story h1{font-size:30px;margin:12px 0}.login-story>p{font-size:18px}.login-art{display:none}.login-card{padding:28px 24px;border-left:0}.login-card>h2{font-size:30px}.request-tile{min-height:158px}.top-actions .btn{font-size:11px}.metric h2{font-size:30px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}