/* TelesatGuard: comprobación del navegador antes del login. Independiente de app.css
   a propósito, para que se vea aunque lo demás aún cargue. Diseño adaptado de Sol Guard. */
:root{--g-bg1:#eaf5ff;--g-bg2:#dbeafe;--g-card:#fff;--g-head:#2563eb;--g-text:#111827;--g-muted:#4b5563;--g-line:#dbe3ef;--g-accent:#2563eb;--g-soft:#dbeafe;--g-foot:#f8fafc;--g-err:#b91c1c}
@media (prefers-color-scheme:dark){:root{--g-bg1:#0b1220;--g-bg2:#111a2e;--g-card:#151f33;--g-head:#1d4ed8;--g-text:#f3f4f6;--g-muted:#a7b0c0;--g-line:#2a3752;--g-accent:#60a5fa;--g-soft:#1e2a47;--g-foot:#111a2e;--g-err:#fca5a5}}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--g-text);background:linear-gradient(135deg,var(--g-bg1),var(--g-bg2));display:flex;align-items:center;justify-content:center;padding:16px}
.guard{width:100%;max-width:600px;background:var(--g-card);border-radius:8px;box-shadow:0 18px 50px rgba(15,23,42,.18);overflow:hidden}
.guard-head{background:var(--g-head);color:#fff;display:flex;align-items:center;justify-content:center;gap:12px;padding:30px 16px;font-size:1.35rem;font-weight:700}
.guard-head img{width:40px;height:40px;border-radius:10px;background:#fff;padding:3px}
.guard-body{padding:32px 30px 28px;text-align:center}
.shield{width:60px;height:68px;margin:0 auto 18px;display:block}
.guard h1{font-size:1.6rem;margin:0 0 10px}
.guard p{margin:0;color:var(--g-muted)}
.dots{display:flex;justify-content:center;gap:12px;margin:34px 0 36px;height:18px}
.dots i{width:12px;height:12px;border-radius:50%;background:var(--g-accent);animation:bob 1.1s ease-in-out infinite}
.dots i:nth-child(2){animation-delay:.12s}.dots i:nth-child(3){animation-delay:.24s}.dots i:nth-child(4){animation-delay:.36s}
@keyframes bob{0%,100%{transform:translateY(0);opacity:.55}50%{transform:translateY(5px);opacity:1}}
.bar{height:8px;background:var(--g-line);border-radius:4px;overflow:hidden;margin-bottom:22px}
.bar b{display:block;height:100%;width:0;background:var(--g-accent);border-radius:4px;transition:width 1.2s ease}
.steps{display:grid;grid-template-columns:repeat(4,1fr);position:relative;list-style:none;margin:0;padding:0}
.steps:before{content:"";position:absolute;left:12.5%;right:12.5%;top:20px;height:2px;background:var(--g-line)}
.steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:.78rem;color:var(--g-muted)}
.steps span{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;background:var(--g-soft);color:var(--g-accent);position:relative;z-index:1}
.steps .done span,.steps .active span{background:var(--g-accent);color:#fff}
.steps .done span:after{content:"\2713"}
.steps .done span em{display:none}
.steps em{font-style:normal}
.guard-error{display:none;margin-top:22px;color:var(--g-err);font-size:.92rem}
.guard-error.on{display:block}
.guard-error button{margin-top:12px;font:inherit;font-weight:600;background:var(--g-accent);color:#fff;border:0;border-radius:6px;padding:9px 18px;cursor:pointer}
.guard-foot{background:var(--g-foot);border-top:1px solid var(--g-line);padding:16px;text-align:center;font-size:.84rem;color:var(--g-muted)}
.guard-foot strong{color:var(--g-text)}
.guard-foot small{display:block;margin-top:4px;font-size:.76rem}
noscript p{padding:0 30px 26px;color:var(--g-err);text-align:center}
@media (max-width:520px){.guard-body{padding:26px 16px 22px}.guard h1{font-size:1.35rem}.steps li{font-size:.7rem}}
@media (prefers-reduced-motion:reduce){.dots i{animation:none}.bar b{transition:none}}