:root{
      --infop-cyan:#39d5ed;
      --infop-text:#083c4a;
      --header-h:56px;
    }
    html,body{ height:100%; margin:0; overflow:hidden; background:#0f172a; }

    /* Topbar */
    .topbar{
      position:fixed; inset:0 0 auto 0; height:var(--header-h);
      background:var(--infop-cyan); color:var(--infop-text);
      display:flex; align-items:center; gap:.75rem; padding:.5rem .75rem;
      box-shadow:0 6px 24px rgba(0,0,0,.12); z-index:10;
    }
    .topbar .title{ font-weight:700; letter-spacing:.2px; }

    /* Área del iframe */
    .embed-wrap{ position:fixed; top:var(--header-h); left:0; right:0; bottom:0; background:#fff; }
    .embed-wrap iframe{ width:100%; height:100%; border:0; display:block; }

    /* Botones superiores (mismo estilo para volver y recargar) */
    .btn-top{
      display:inline-flex; align-items:center; gap:.4rem;
      background:#ffffff;
      color:#0b2136;
      border:1px solid rgba(0,0,0,.15);
      font-weight:600;
      border-radius:999px;
      padding:.375rem .75rem;
      box-shadow:0 4px 14px rgba(0,0,0,.08);
      transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
      text-decoration:none; /* por si es <a> */
    }
    .btn-top:hover{
      background:#f8fafc;
      transform: translateY(-1px);
      box-shadow:0 8px 20px rgba(0,0,0,.12);
      text-decoration:none;
      color:#0b2136;
    }
    .btn-top svg{ width:16px; height:16px; display:block; }