
:root{
  --bg:#0b0c10; --card:#111218; --muted:#9aa1ad; --text:#e6e8ee; --accent:#ff8a1a; --border:#222533;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; background:var(--bg); color:var(--text); font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
a{ color:var(--text); text-decoration:none; }
a:hover{ text-decoration:underline; }
.wrap{ max-width:1080px; margin:0 auto; padding:16px; position:relative; z-index:1; }
.bg-watermark{ position:fixed; inset:0; background:url('/static/logo-watermark.png') center/58% no-repeat; opacity:0.06; pointer-events:none; z-index:0; filter: invert(1) brightness(1.4); }
.topbar{ position:sticky; top:0; z-index:10; border-bottom:1px solid var(--border); background:#0b0c10e6; backdrop-filter:saturate(120%) blur(6px); }
.navwrap{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.brandwrap{ display:flex; align-items:center; gap:10px; }
.brand-logo{ height:28px; width:auto; display:block; }
.brand{ font-weight:700; letter-spacing:0.2px; }
.topbar nav a{ margin-left:12px; }
.primary{ background:var(--accent); color:#1a1a1a; padding:10px 14px; border-radius:10px; display:inline-block; font-weight:600; }
.table{ width:100%; border-collapse:collapse; overflow:hidden; border-radius:14px; }
.table th, .table td{ padding:12px 14px; border-bottom:1px solid var(--border); }
.table th{ text-align:left; color:var(--muted); font-weight:600; }
.form label{ display:block; margin:10px 0; font-weight:500; }
.form input, .form select, .form textarea{ width:100%; padding:10px 12px; border-radius:10px; border:1px solid var(--border); background:#0f1118; color:#e6e8ee; }
.button{ display:inline-block; padding:10px 12px; border:1px solid var(--border); border-radius:10px; }
.grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.card{ background:var(--card); border:1px solid var(--border); padding:18px; border-radius:14px; margin:16px 0; }
.muted{ color:var(--muted); }
h1,h2,h3{ margin:8px 0 12px; }
.item{ border:1px dashed var(--border); padding:12px; border-radius:12px; margin-bottom:10px; }
.splash{ display:grid; place-items:center; padding:96px 0; }
.splash-card{ background:linear-gradient(180deg, rgba(26,27,38,.6), rgba(17,18,24,.9)); border:1px solid var(--border); padding:32px; border-radius:18px; text-align:center; max-width:720px; width:100%; position:relative; }
.splash-logo{ width:110px; height:auto; margin-bottom:12px; }
.splash-actions{ margin-top:14px; }
.small{ font-size:12px; color:var(--muted); }
.list{ padding-left:16px; }
.hstack{ display:flex; gap:8px; align-items:flex-end; flex-wrap:wrap; }
@media (max-width:720px){
  .grid{ grid-template-columns:1fr; }
  .wrap{ padding:12px; }
}


/* === Glass styles (non-intrusive) === */
.glass-btn{
  background: rgba(255,255,255,0.06);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 12px;
  padding: 8px 12px;
}
.glass-btn:hover{ background: rgba(255,255,255,0.10); }
.glass-btn.danger{ border-color: rgba(255,99,71,0.35); }
.input-glass{
  background: rgba(255,255,255,0.06);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color:#fff;
  border:1px solid rgba(255,255,255,0.14);
  border-radius:12px;
  padding:10px 12px;
}
.small { font-size: 12px; padding: 6px 10px; border-radius: 10px; }

/* ↓ Empuja TODO el contenido una línea cuando se imprime */
@media print {
  /* 12pt ≈ 1 renglón si el texto está a ~12pt; ajusta a 14pt/16pt si tu tipografía es mayor */
  body { margin-top: 12pt !important; }
}

